高速化したサイト PHPで以前に作ったWebサイトを、 リニューアルついでにReact+Node.jsで書き直して、高速化を試みた一部始終です。 まとめ ファイルを圧縮して、gzipとHTTP/2で通信を最適化した後に、キャッシュを活用し、アニメーションを追加すれば、満足のいくスピードになる。 重たいWebフォントを読み込んですみません駆動開発。 対象のサイト 邦画の予告を、朝まで という名前の、文字通り邦画の予告をひたすら観られるサイトです。 たまには邦画も悪くないですよ。 課題の把握 ・初期表示にやたら時間がかかる ・ページ遷移の待ち時間が長く感じる ・ページ遷移時にバコってなる違和感 React+Node.jsでリニューアルした後、初期表示の遅さなどが原因で、体感的に遅くなってしまったのが高速化のきっかけです。 高速化の軸 ユーザーを第一に考えます。最終目標は、特定の端末でのサイトの
![サイト高速化による罪滅ぼしと、SSRをしない勇気 - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/60ef360f96367a574e6a87bf6c5ffcc15d0e3222/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fcdn.qiita.com%252Fassets%252Fpublic%252Farticle-ogp-background-412672c5f0600ab9a64263b751f1bc81.png%3Fixlib%3Drb-4.0.0%26w%3D1200%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTk3MiZoPTM3OCZ0eHQ9JUUzJTgyJUI1JUUzJTgyJUE0JUUzJTgzJTg4JUU5JUFCJTk4JUU5JTgwJTlGJUU1JThDJTk2JUUzJTgxJUFCJUUzJTgyJTg4JUUzJTgyJThCJUU3JUJEJUFBJUU2JUJCJTg1JUUzJTgxJUJDJUUzJTgxJTk3JUUzJTgxJUE4JUUzJTgwJTgxU1NSJUUzJTgyJTkyJUUzJTgxJTk3JUUzJTgxJUFBJUUzJTgxJTg0JUU1JThCJTg3JUU2JUIwJTk3JnR4dC1hbGlnbj1sZWZ0JTJDdG9wJnR4dC1jb2xvcj0lMjMyMTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9NTYmcz03ZDhjZDNjZjI0Y2VhZmM0OGFmZWFmYTM5ZDkwZjBhNg%26mark-x%3D142%26mark-y%3D57%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZoPTc2Jnc9NzcwJnR4dD0lNDBuaXNoaW5vc2hha2UmdHh0LWNvbG9yPSUyMzIxMjEyMSZ0eHQtZm9udD1IaXJhZ2lubyUyMFNhbnMlMjBXNiZ0eHQtc2l6ZT0zNiZ0eHQtYWxpZ249bGVmdCUyQ3RvcCZzPTNhZThmMmY3NGNmZGE0ZjA5OGIzOTFkYmUyZDNlMzIw%26blend-x%3D142%26blend-y%3D486%26blend-mode%3Dnormal%26s%3Dbd08f5281734bc00d64720e20cd8dc68)