tsugawara-IDCF https://blog.hatena.ne.jp/tsugawara-IDCF/ IDCF テックブログ https://blog.idcf.jp/ javascript IDCFクラウド フロントエンド 今回は、ブラウザ上で `画面が表示されてから操作可能になるまでの速度` を計測し、Google Analytics で可視化する対応について説明します。 IDCFクラウドの仮想マシン一覧で保有しているVMの数が多いと、JavaScriptの処理が画面を30秒以上ロックしてしまう現象が発生しました。 お客さまの報告から発覚したことですが、「遅い！」というキーワードから連想するのはサーバーのレスポンスタイムという先入観があったので、そのような状況に気づけませんでしたし、フロントエンドの速度を計測していない状態での調査は大変でした。JavaScriptの処理を修正し、遅いという問題は改善しましたが、今後このような事態を分析できるデータが必要だという課題が残りました。 これらを改善したいという思いから、この対応に取り組みました。 190 <iframe src="https://hatenablog-parts.com/embed?url=https%3A%2F%2Fblog.idcf.jp%2Fentry%2Ffrontend-tips-1" title="フロントエンドエンジニア必見！画面が表示されてから操作可能になるまでの速度計測について - IDCF テックブログ" class="embed-card embed-blogcard" scrolling="no" frameborder="0" style="display: block; width: 100%; height: 190px; max-width: 500px; margin: 10px 0px;"></iframe> https://cdn-ak.f.st-hatena.com/images/fotolife/t/tsugawara-IDCF/20190619/20190619180217.png Hatena Blog https://hatena.blog 2019-06-27 10:00:00 rich https://blog.idcf.jp/entry/frontend-tips-1 1.0 100%