目次
CSS は常に JavaScript よりも優先されるべきですか?
ホームページ ウェブフロントエンド CSSチュートリアル HTML では CSS を常に JavaScript の前に置く必要がありますか?

HTML では CSS を常に JavaScript の前に置く必要がありますか?

Nov 24, 2024 pm 07:06 PM

Should CSS Always Precede JavaScript in HTML?

CSS は常に JavaScript よりも優先されるべきですか?

従来の知識:

一般的な推奨事項は、次の理由により、JavaScript よりも先に CSS を配置することで長い間推奨されてきました:

  • レンダリングページのすべてのスタイル情報をレンダリングします。
  • JavaScript が以前に含まれている場合、JavaScript エンジンは次のリソースのセットに進む前にすべてを解析する必要があります。
  • これは、必要なスタイルがすべて揃っていないため、レンダリング スレッドがページを完全に表示できないことを意味します。

実際のテスト:

ただし、実際のテストでは大きく異なる結果が示されました:

  • JavaScript は実行を開始しません。 CSSがダウンロードされます。
  • したがって、JavaScript スレッドを長時間実行できるため、JavaScript を先頭に組み込んだ方が効率的であると思われます。

結論:

  • デスクトップブラウザの場合: 最新のブラウザでは、JavaScript の前に CSS を置きます パフォーマンスの向上をもたらします。場合によっては、パフォーマンスの低下を引き起こす可能性もあります (CSS が遅延する場合など)。したがって、 JavaScript ** の後に外部スタイルシート ** にリンクする必要があります。
  • モバイル ブラウザーの場合: 一部のモバイル ブラウザー (WebKit for Android など) は依然として予測解析を行っていないという証拠があります。このようなブラウザでは、CSS の前にスクリプトを配置すると、パフォーマンスが低下する可能性があります。

技術的な説明:

静的フォームプロバイダーの比較 静的フォームプロバイダーの比較 Apr 16, 2025 am 11:20 AM

ここでは、「静的フォームプロバイダー」という用語を埋めてみましょう。あなたはあなたのHTMLを持ってきます

SASSをより速くするための概念の証明 SASSをより速くするための概念の証明 Apr 16, 2025 am 10:38 AM

新しいプロジェクトの開始時に、SASSコンピレーションは瞬く間に起こります。これは、特にbrowsersyncとペアになっている場合は素晴らしい気分です。

毎週のプラットフォームニュース:HTMLロード属性、主なARIA仕様、およびIFRAMEからShadowDOMへの移動 毎週のプラットフォームニュース:HTMLロード属性、主なARIA仕様、およびIFRAMEからShadowDOMへの移動 Apr 17, 2025 am 10:55 AM

今週のプラットフォームニュースのラウンドアップで、Chromeは、Web開発者のロード、アクセシビリティ仕様、およびBBCの動きのための新しい属性を導入します

HTMLダイアログ要素を使用したいくつかの実践 HTMLダイアログ要素を使用したいくつかの実践 Apr 16, 2025 am 11:33 AM

これは私が初めてHTML要素を見ていることです。私はしばらくの間それを知っていましたが、まだスピンしていませんでした。かなりクールです

ペーパーフォーム ペーパーフォーム Apr 16, 2025 am 11:24 AM

購入またはビルドは、テクノロジーの古典的な議論です。自分で物を構築することは、あなたのクレジットカードの請求書にはラインアイテムがないため、安価に感じるかもしれませんが

「ポッドキャストにサブスクライブ」リンクはどこにすべきですか? 「ポッドキャストにサブスクライブ」リンクはどこにすべきですか? Apr 16, 2025 pm 12:04 PM

しばらくの間、iTunesはポッドキャストの大きな犬だったので、「ポッドキャストにサブスクライブ」をリンクした場合:

毎週のプラットフォームニュース:テキスト間隔のブックマークレット、トップレベルの待望、新しいアンプロードインジケーター 毎週のプラットフォームニュース:テキスト間隔のブックマークレット、トップレベルの待望、新しいアンプロードインジケーター Apr 17, 2025 am 11:26 AM

今週のラウンドアップ、タイポグラフィを検査するための便利なブックマークレットである。

独自の非JavaScriptベースの分析をホストするためのオプション 独自の非JavaScriptベースの分析をホストするためのオプション Apr 15, 2025 am 11:09 AM

サイトの訪問者と使用データを追跡するのに役立つ分析プラットフォームがたくさんあります。おそらく、特にGoogleアナリティクスが広く使用されています

See all articles