完全理解.FM

About 完全理解.FM

話題の技術トピックスやエンジニア環境の話を中心に、初級者·中級者が完全に理解したつもりになれるようなコンテンツを提供します！

Publisher

菊池翔

Category

technology

Language

ja

Explicit

No

First episode

29 Jun 2022

Latest episode

7 Apr 2024

Latest episodes

34 episodes in the feed.

1. 

   7 Apr 2024

   Core Web Vitals FIDからINPに変わったよ話

   Core Web VitalsのFID から INP に変わったという内容で話してみました。CWVとの付き合い方として参考になれば…！ 00:00 OP 02:11 CWVとは 13:09 計測するメリット 22:17 CWVとの付き合い方 26:46 クロージング 1. 3/12 から CWV の指標が FID から INP に変わったよ 2. Web パフォーマンスの話 3. CWV ってなに？ 4. FID、INP ってなに 5. FID から INP に変わってどうなるの？ ## 3/12 から Interaction to Next Paint(INP) が Core Web Vitals の主な指標に https://web.dev/blog/inp-cwv-march-12?hl=ja - First Input Delay(FID)から INP に置き換わる 実際にLighthouseでFIDがINPに変わってる ## レスポンスタイムについてのヤコブニールセンの研究 Jakob Nielsen, “Website Response Times,” (2010) https://www.nngroup.com/articles/website-response-times/ - 0.1 秒 … 即時に感じられる。キー入力やドラッグアンドドロップなどの Direct Manipulation においては満たしたい時間 - 1 秒 … 遅延は認識しているがユーザーがフローをシームレスと感じられる時間。ナビゲーションで満たしたい基準 - 10 秒 … ユーザーが注意を持ち続けられる時間。これ以上経過すると他のことを考えるようになる。 他の事例からも、Web パフォーマンスはユーザーの生産性と大きく関係してる ## Core Web Vitals (CWV) とは https://web.dev/articles/vitals?hl=ja - ユーザー体験に関する指標 - 3/12 以前までは - FID - ユーザーがページを表示してから最初の操作(クリック)からブラウザが反応するまでの時間 - 操作性 - Largest Contentful Paint(LCP) - 最初にページに移動したときに、ビューポートに表示される最も大きなコンテンツのレンダリング時間 - ローディング - Cumulative Layout Shift(CLS) - ページが表示されるまでに発生するレイアウトのずれ - レイアウトの安定性 - 3/12 以降は - INP - LCP - CLS - それぞれの指標はいずれも Performance API で取得できる - https://developer.mozilla.org/ja/docs/Learn/Performance/Measuring_performance#%E3%83%91%E3%83%95%E3%82%A9%E3%83%BC%E3%83%9E%E3%83%B3%E3%82%B9_api - INP で使用する API やプロパティは Chrome のみが対応してる - https://developer.mozilla.org/en-US/docs/Web/API/PerformanceEventTiming - それぞれの指標は 75%タイルで下記の値以下だと Good、つまり良いユーザー体験が提供できてるって言える - INP: 200ms - LCP: 2.5s - CLS: 0.1 ## INP とは https://web.dev/articles/inp?hl=ja - FID と大きく変わった点は、ユーザー操作に対してブラウザが反応するまでの時間をずっと計測すること - FID では最初の操作のみだった ### INP 改善事例 - https://web.dev/economic-times-inp/ - INP が改善されたことで PV が 43%増加 - https://web.dev/redbus-inp/ - INP を改善し、売上を 7%増加させた ## FID から INP になって何が変わるのか - 個人の感想だけども、より今の Web アプリケーションに即したユーザー体験を計測できるようになったのではと - 最近の Web アプリは、画面に対してユーザーが操作する部分が増えてる - 操作に対して実際にユーザーがどんな体験をしているのか、INP によって詳細にキャッチできそう

2. 

   10 Feb 2024

   Remix - Reactのフルスタックフレームワークについて -

   今回はnus3とReactのフレームワークであるRemixについて色々話してみました 00:00 OP 00:21 イントロ・Remixの概要 03:50 Remixに触れてみての所感 10:53 vs Next.js 23:20 Remixの気になりポイント 28:00 まとめと次回予告

3. 

   27 Jan 2024

   2023年の振り返りと若くあり続けるために

   半年ぶりの収録だったので去年の振り返りと雑な会話を収録しつつ、筋肉は大事だという話をしました 00:00 OP 00:22 イントロ 01:40 nus3の振り返り 09:33 kkの振り返り 24:26 年に抗うために 28:38 まとめと次回予告

Reach and audience

Public platform figures. Ratings count people who left a rating, not total listeners.

Spotify

5.0 / 5

6 ratings

Contact 完全理解.FM

Guest appearances

Books guests

Based on episode analysis; this does not confirm that the show is currently accepting guests.