SEインターンシップログ[ 4 ]

こんにちは、インターネットストレンジャー.👋🏽
ソフトウェアエンジニアリング(SE)ログの第5版へようこそ.
今週はイライラしました.私は1週間に1 - 3回(1時間毎に実行されるcron仕事)失敗したテストをデバッグしようとして、週を過ごしました.
いつ失敗しますか.いつでも.
なぜ失敗しますか?応答データは20(期待)ではなく0である.
なぜ0ですか.いいえfreakin '手がかり.🥲
うまくいけば、今度の週は前の週よりよいでしょう.
十分に、ラントで.今週、私はパフォーマンスの再考察、Next.js measuring performance、label-sync、積極的なものの束を学んだ.

技術的な技術

パフォーマンス再考

これはBloated JavaScriptのバンドルや最適化にはなりません.私は専門家ではない.
今週、私は私が働いていたタスクのPRについてのコメントを得ました.私は高価なAPI呼び出しをしていました--どんなテーブルのためにユーザーのデータベースチェックを内省しても.
大したことない?まあ、そうです.この操作は、ユーザーがプロジェクトを開くたびに発生します.
これはフロントエンドからのAPIリクエストについてどう考えているかを変更しました.

コスト

ユーザーエクスペリエンス.

計算は、タスクを実行するために必要である.そして、API、そして、このケースのそのユーザーのリソースはそれらのデータベース

である
あなたが何かをすることができるので、あなたはそうしなければなりません.計算資源は有限である.あなたが作るリクエストの影響を評価し、どのように必要でないかを減らすことができます.

次。パフォーマンス測定

Vercelは別のスタックのためのアプリケーションのパフォーマンスに解析を提供します-次.js含まれています.
次.JSは、分析を測定し、独自のカスタム分析を使用できるツールを提供することができます.
次のメトリック.JSでは以下を含めることができます.

Web Vitals -これらのメトリックは測定し、偉大なユーザーエクスペリエンスを提供していることを確認するために、アプリケーションのパフォーマンスを報告します.

Custom Metrics -これは次の特定です.JSのページの時間を測定し、水和し、レンダリング:

Next.js-hydration -時間が開始して、

を水和させ終えることのために時間をとってください

Next.js-route-change-to-render -ルート

に移動した後にページをレンダリングするページの時間

Next.js-render -ルート変更

の後、レンダリングを終えるページのためにされる時間

💡 Fun learning project idea - build your own/ custom tool to measure these analytics. The aim would be to learn how to store time-series data, average the data, and visualize the data. Chrome devtools and Web.dev doesn't measure custom Next.js metrics.
You can see how well my site is performing 🤡

あなたの次で.JSアプリケーション、編集/_app.jsディレクトリの/pagesを作成します.reportWebVitals関数を定義します.

export function reportWebVitals(metric) {
  switch (metric.name) {
    case 'FCP':
    // handle results - console.log or send to an API (same case for other metrics)
      break
    case 'LCP':
      break
    case 'CLS':
      break
    case 'FID':
      break
    case 'TTFB':
      break
    case 'Next.js-hydration':
      break
    case 'Next.js-route-change-to-render':
      break
    case 'Next.js-render':
      break
    default:
      break
  }
}

これらの分析は、ユーザーエクスペリエンスがどのようにしているか、あなたのアプリケーションの部分があまりうまくいきませんし、Webアプリケーションのパフォーマンスを向上させる上でのヒントを提供します.

🧰 ラベルシンク

ラベルの同期は、複数のリポジトリを介して楽しくgithubラベルを管理する便利なツールです.
なぜあなたはそれを必要としますか?君はそうしない.
デフォルトのgithubラベルはOKです.しかし、彼らはよりよいかもしれません.
GithubラベルはGithub問題のメタデータを提供します.これは、バックエンド、フロントエンド、バグ、テスト、改善、機能、問題が議論を必要とするかどうか、時間、そしてリストがこれが何であるかもしれないかに関して進行するかどうか、与えられた問題の文脈でありえました
ラベルの同期に影響を受けるリポジトリ、ラベル、テーマ、説明、グループのラベルなどを定義することができます.
起動時にいくつかの設定が必要です.しかし、あなたのプロジェクトの管理の問題は、喜びになります.
これが個人的意見だ.

ソフトスキル

積極的である

積極的であることはあなたの人生で責任を取ることを含みます.それは、解決策を求めて、問題を予測し、それをあなたの最高のショットを与える含まれています.
積極的であることへの代替は、彼らが流れて、タスク/生命に反応しています.
あなたのキャリアを含むあなたの成長に責任があります.
そこに行く、エースそれは素晴らしい一週間を過ごす!
来週まで.✌🏽