0Pricing
Web Performance Optimization & Lighthouse · レッスン

主要なパフォーマンス指標

読み込み時間、Time To Interactive、First Contentful Paintなど、重要なパフォーマンス指標について学びます。

「主要なパフォーマンス指標」はCoddyKit上の無料Web Performance Optimization & Lighthouseレッスンです。 これはレッスン3/4です。 下記で完全なレッスンを無料で読むことができます。その後、ブラウザ内の組み込みコードエディタと24時間対応のAIチューターでハンズオン演習できます。 これはWeb Performance Optimization & Lighthouse学習パスの一部であり、ウェブとCoddyKitアプリ全体で進捗が同期されます。 Web Performance Optimization & Lighthouseコースには全4レッスンが含まれています。

このレッスンの一部はまだ翻訳されておらず、英語で表示されています。

Welcome to Performance Metrics

Performance metrics are how we measure fast versus slow — key indicators that quantify the experience during loading and interaction.

Why Metrics Matter

Metrics turn "this feels slow" into hard data. That lets you pinpoint bottlenecks, track gains over time, and benchmark against rivals.

The General 'Load Time'

"Load time" is vague — it lumps everything together. We break it into specific stages so you can analyze each part of the load.

First Contentful Paint (FCP)

First Contentful Paint (FCP) marks when the browser paints the first content — text or image. It tells users the page is alive, not blank.

FCP in Action

FCP fires the moment the browser paints any HTML content, like a heading. It is the first visual feedback a user gets.

Time To Interactive (TTI)

Time To Interactive (TTI) marks when the page is rendered and the main thread can reliably handle input — when users can actually click and type.

Why TTI is Crucial

A fast paint is useless if clicks do nothing. Good TTI prevents "rage clicks" by ensuring the page responds when it looks ready.

Speed Index (SI)

Speed Index (SI) scores how quickly visible content fills in during load. Lower is better — it captures overall visual progress, not one moment.

Total Blocking Time (TBT)

Total Blocking Time (TBT) sums the time between FCP and TTI when the main thread was blocked. Long scripts block input — TBT quantifies that pain.

Other Important Metrics

Beyond the basics, watch the Core Web Vitals: LCP (largest paint), CLS (layout shift), and FID (input delay) for a deeper UX view.

Check Your Knowledge

You've learned about several key performance metrics. Let's see if you can identify which one focuses on initial visual feedback.

Recap: Essential Metrics

You now know the core metrics: FCP, TTI, Speed Index, and TBT. Together they turn user experience into numbers you can act on.

よくある質問

「主要なパフォーマンス指標」レッスンは無料ですか?

はい。「主要なパフォーマンス指標」の完全なテキストはこのウェブで無料で読めます。インタラクティブに演習し(組み込みコードエディタと24時間対応のAIチューター)、Web Performance Optimization & Lighthouseコースの残りをアンロックするには、CoddyKit PROにアップグレードしてください。 Web Performance Optimization & Lighthouseコースには全4レッスンが含まれています。

「主要なパフォーマンス指標」で何を学びますか?

読み込み時間、Time To Interactive、First Contentful Paintなど、重要なパフォーマンス指標について学びます。 ブラウザで直接実行するハンズオンコードでWeb Performance Optimization & Lighthouseを演習し、24時間対応のAIチューターがレッスンを進める中での質問に答えます。

Web Performance Optimization & Lighthouseを始めるのに経験は必要ですか?

事前経験は必要ありません。CoddyKitのWeb Performance Optimization & Lighthouseは初級者から上級者向けに構成されているため、ここから始めるか最初から始めて、自分のペースで進むことができます。 これはレッスン3/4です。

「主要なパフォーマンス指標」レッスンにはどのくらい時間がかかりますか?

ほとんどのCoddyKitレッスンは約5~10分かかります。各レッスンはコンパクトでインタラクティブなので、着実に進歩し、ウェブとアプリ全体で正確に前回の場所から再開できます。

このWeb Performance Optimization & Lighthouseレッスンでコードを書いて実行できますか?

はい。すべてのWeb Performance Optimization & Lighthouseレッスンに組み込みコードエディタが含まれているため、ブラウザでリアルコードを書いて実行し、即座のAIフィードバックを取得できます。ローカル設定は不要です。

このコースのすべてのレッスン

  1. Webパフォーマンスとは
  2. パフォーマンスが重要な理由
  3. 主要なパフォーマンス指標
  4. ページ読み込みの仕組み
← Web Performance Optimization & Lighthouseに戻る