問題タブ [deferred-loading]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
css - 最初のページ ビューが最も重要な場合に、重要な CSS のみをインライン化しますか、それとも 15kb の CSS 全体をインライン化しますか?
CSS を 2 つの部分、インライン クリティカル部分と遅延外部部分に分割するのは良い考えかどうか疑問に思っていました。
私のCSS全体は15kb(縮小)です。オンラインの「クリティカル パス CSS ジェネレーター」アナライザーが提供する重要な CSS は 1kb ですが、コードを確認すると、1920x1080 の画面でスクロールせずに見えるコンテンツをすべてレンダリングするには 5kb の CSS が必要であると確信しています。したがって、私の最初の懸念は、CSS の 3 分の 1 が重要な CSS として必要な場合に CSS を分割する価値があるか、それともそれほど大きくない (15kb) ことを考えると、CSS 全体をインライン化するべきかということです。
一方、私がここで注目しているのは、ユーザーにアクションを起こさせる Web サイト全体の一部であり、そのアクションは別の CMS を持つ Web サイトの別の部分に移動することです。したがって、私が話しているこの部分については、各ユーザーのページビュー数はそれほど多くありません。約 70% の人がここで 1 ページしか開いておらず、92% の人が 4 ページ未満しか開いていません。したがって、キャッシュされた外部 CSS を持つことは、私たちの状況ではそれほど重要ではないかもしれません。最後に、最初のページ ビューが最も重要だと感じています。次のページの速度が遅くなっても、速度を少し上げることができれば、それだけの価値があります。ただし、外部 CSS ではなくインライン CSS を使用することで、HTTP/2 を使用した場合に実際に速度が変わるかどうかはわかりません。
それで、あなたは何を提案しますか?CSS を分割して重要な部分のみをインライン化するか、単にファイル全体をインライン化する方がよいでしょうか? 助けてくれてありがとう。
pagespeed - pagespeed の洞察 未使用の CSS と画面外の画像を延期する
私はすべてのCSSを使用して延期しました
およびyall.min.jsを使用した画像
しかし、PageSpeed Insights はそれを主張し続けています (画像も表示されています)。
これを最適化するにはどうすればよいですか?
ありがとう、アリ