面接形式、システム設計、雑学、コーディング問題、企業ごとの面接トピックを網羅した、無料のオープンソースなフロントエンド面接対策ハンドブックです。
thedaviddias/Front-End-Performance-Checklist
HTML、CSS、フォント、画像、JavaScript、サーバー設定を網羅し、理由や対処法、関連ツールを示す包括的なフロントエンド性能チェックリスト。
- スター
- 17,381
- フォーク
- 1,255
- 未解決の Issue
- 1
- 最終コミット
- 9 日前
これは何?
Front-End Performance Checklistは、フロントエンド開発者がWebサイトやアプリケーションを確認するための、性能に関するルールをまとめたリストです。各ルールでは重要な理由と改善方法を説明し、多くの項目に参考ツールや記事へのリンクが付いています。
チェックリストはHTML、CSS、フォント、画像、JavaScript、サーバー側の配信などの領域別に構成され、主要なフレームワークやWordPressに関するセクションもあります。各項目には低・中・高の優先度が示されているため、どこから着手するか判断できます。トピックには、圧縮、レンダリングを妨げるリソース、クリティカルCSS、Webフォント形式、遅延読み込み、レスポンシブ画像、service worker、HTTPS、キャッシュヘッダー、圧縮などが含まれます。
リポジトリには、WebPageTest、PageSpeed Insights、Lighthouse、Sitespeed.ioなど、性能テストや監視に使うツールもまとめられています。また、他言語への翻訳一覧も掲載されています。
主な機能
- 01HTML、CSS、フォント、画像、JavaScript、サーバー側の配信を1つのチェックリストで網羅。
- 02各ルールの理由と、改善方法を説明。
- 03各項目に低・中・高の優先度を表示。
- 04WebPageTest、Lighthouse、PageSpeed Insightsなどのテストツールにリンク。
- 05React、Angular、Vue、WordPressの性能に関するセクションを掲載。
ユースケース
- リリース前にWebサイトやWebアプリを監査し、性能上の問題を見つける。
- フロントエンド開発者に一般的な性能改善の手法を共有する。
- チームの開発プロセスに性能レビューの工程を組み込む。
- ページ速度の測定や継続的な監視に使うツールを調べる。
トピック
よくある質問
- Front-End-Performance-Checklist とは?
- HTML、CSS、フォント、画像、JavaScript、サーバー設定を網羅し、理由や対処法、関連ツールを示す包括的なフロントエンド性能チェックリスト。 Front-End Performance Checklistは、フロントエンド開発者がWebサイトやアプリケーションを確認するための、性能に関するルールをまとめたリストです。各ルールでは重要な理由と改善方法を説明し、多くの項目に参考ツールや記事へのリンクが付いています。
- Front-End-Performance-Checklist は無料で使えますか?ライセンスは?
- Front-End-Performance-Checklist は MIT ライセンスのオープンソースです。商用製品で使う前にライセンス条件を確認してください。
- Front-End-Performance-Checklist は今もメンテナンスされていますか?
- 活発にメンテナンス中。Front-End-Performance-Checklist の最終コミットは 2026年10月13日 です。
- Front-End-Performance-Checklist は何に使えますか?
- リリース前にWebサイトやWebアプリを監査し、性能上の問題を見つける。 フロントエンド開発者に一般的な性能改善の手法を共有する。 チームの開発プロセスに性能レビューの工程を組み込む。 ページ速度の測定や継続的な監視に使うツールを調べる。
- Front-End-Performance-Checklist はどこで入手できますか?
- ソースコードとインストール手順は GitHub にあります:https://github.com/thedaviddias/Front-End-Performance-Checklist
概要はプロジェクトの README をもとに AI が生成しています。GitHub の数値は毎日更新されます。
関連プロジェクト
テラリウム、タイピングゲーム、宇宙ゲームなどの実践プロジェクトを通じてHTML、CSS、JavaScriptを学ぶ、12週間・全24レッスンの初心者向けカリキュラム。
高速で堅牢、柔軟なWebサイトやWebアプリを構築するための、プロ品質のフロントエンド向けHTML・CSS・JavaScriptスターターテンプレート。
人とAIエージェント向けに、フロントエンドのベストプラクティス386項目をまとめたオープンソースのチェックリスト。エージェントによる監査に使えるホスト型MCPサーバーも提供します。
初心者向けの無料JavaScript講座。毎日のレッスン、演習、ミニプロジェクトを通じて30日間で段階的に学べます。
リセット、レイアウト、セレクター、タイポグラフィ、レスポンシブなサイズ指定を、短いコード例とともに紹介する実用的なCSS Tips集。