慣性

Mar 17, 2025 am 10:29 AM

慣性

Jeremyの開発者ツールの分類は、常に私に感銘を受けました。

2種類のWeb開発ツールについて言及しましたが、これらのカテゴリをどのように呼び出すかはまだわかりません。内部と外部?開発者とユーザーのために?

最初のカテゴリには、ビルドツール、バージョンコントロール、翻訳者、前処理者、およびコードインスペクターが含まれます。これらのツールは、マシンで、またはサーバーで実行されます。これを書き込み、Webの原材料、HTML、CSS、およびJavaScriptの原材料に変換します。

2番目のタイプのツールは、Web用の原材料:CSSフレームワークとJavaScriptライブラリで構成されています。

これは考えるのに良い方法であり、もちろんいくつかの微妙さがあります。 SASSは、ユーザーに直接配信されず、ユーザーに配信されるCSSのみを生成するため、最初のカテゴリに属します。ただし、生成するCSSのサイズは、使用方法によって異なるため、ユーザーに影響します。

JeremyはSvelteをライブラリに呼びます。その目標は、コードがユーザーに配信される前に可能な限りコンパイルすることです。 JavaScriptコードはまだありますが、開発者指向のAPIのオーバーヘッドは含まれていません。ここでの微妙さは、すべてのJavaScriptコードを完全に削除する方法でSvelteを使用できることです。たとえば、Sveltekitはその水分機能を完全にオフにし、ページを事前にレンダリングして、完全にJavaScriptのないWebサイトを作成できます(または、少なくとも必要な場合にのみ使用します)。

Reactについて:

最初のタイプのツールのように反応する方法があることは知っていますが、これは間違いなくデフォルトの動作ではありません。そして、デフォルトの動作は本当に重要です。 Reactの場合、デフォルトの動作は、記述したすべてのコード、およびそれを書くために使用するツールがエンドユーザーに送信されると仮定することです。

これは合理的だと思いますが、物語はゆっくりと変化しているようです。 SveltekitがSvelteチーム自体から来ているのと同じように、広範囲に使用しているとはほど遠いと思いますが、サーバーコンポーネントはReactチーム自体から来ているため、ここで注意を払う価値があります。

アストロについて:

[…] Svelteとは異なり、Astroは既存のフレームワークの反応と同じ構文を使用できます。したがって、Reactを学んだ場合 - ジョブを見つけるためにそれを学ぶ必要があるため - 新しい構文を学ばずにAstroを使用できます。

既存のReact WebサイトをワンクリックでAstroに変換できないことは知っていますが、少なくとも明確なアップグレードパスがあります。

これは理論では正しいだけでなく、実際にも正しいです!

私はちょうど私たちの小さなサーバーレスマイクロウェブサイトをギャツビーからアストロに変換しました。 GatsbyはReactに基づいているため、すべてのコンポーネントはReactコンポーネントとして構築されています。プルリクエストは少し面倒ですが、ここにあります。その一部を.astroファイルに変換しましたが、基本的に.JSX Reactコンポーネントと同じ多くのコンポーネントを残しました。ただし、ReactはユーザーのWebサイトに送信されません。 Webサイト上のJavaScriptコードはほぼ完全に削除されており、非常に単純な相互作用のために手書きネイティブJavaScriptコードのみが残りました。

したがって、ここにいくつかのコインが起こっていることがあります。コインの合併?私にとって、アストロは開発者指向のツールに非常に似ています。それは私を助けました。 Vite Compilerを使用します。これは非常に高速で楽しいです(Astroにはまだ1.0に達していないため、Astroには確かに欠点がありますが、DXはほとんど実装されています)。それは私のスタイルをスコープします。 SCSSを書くことができます。これにより、コンポーネントを作成できます(さまざまなフレームワークを使用して)。しかし、それはユーザーにも役立ちます。 WebサイトにはJavaScriptパッケージはまったくありません。

これは、Astroがカテゴリを変更していないことを意味すると思います - これは開発者指向のツールです。元々のユーザー指向ツール(偶数)をほぼ完全に開発者指向のツールに変換するだけです。

私はまだポケットに入っているアストロに関するいくつかのリンクを持っているので、フラビオは始まることに関する素晴らしいチュートリアルを持っています。ここでは、ドリュー・マクレランとマシュー・フィリップスが最近の破壊ポッドキャストでアストロについて議論しています。

ここにいくつかのWebサイトDaveがあります。私は最近Astroとリメイクします。

以上が慣性の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

Video Face Swap

Video Face Swap

完全無料の AI 顔交換ツールを使用して、あらゆるビデオの顔を簡単に交換できます。

ホットツール

メモ帳++7.3.1

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

SublimeText3 中国語版

中国語版、とても使いやすい

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

SublimeText3 Mac版

神レベルのコード編集ソフト(SublimeText3)

Googleフォント変数フォント Googleフォント変数フォント Apr 09, 2025 am 10:42 AM

Google Fontsが新しいデザイン(ツイート)を展開したようです。最後の大きな再設計と比較して、これははるかに反復的です。違いをほとんど伝えることができません

HTML、CSS、JavaScriptを使用してアニメーションカウントダウンタイマーを作成する方法 HTML、CSS、JavaScriptを使用してアニメーションカウントダウンタイマーを作成する方法 Apr 11, 2025 am 11:29 AM

プロジェクトにカウントダウンタイマーが必要だったことはありますか?そのようなことのために、プラグインに手を伸ばすのは自然なことかもしれませんが、実際にはもっとたくさんあります

HTMLデータ属性ガイド HTMLデータ属性ガイド Apr 11, 2025 am 11:50 AM

HTML、CSS、およびJavaScriptのデータ属性について知りたいと思っていたことはすべて。

CSSを介してファーストクラスの名前アイテムを使用して子要素を選択する方法は? CSSを介してファーストクラスの名前アイテムを使用して子要素を選択する方法は? Apr 05, 2025 pm 11:24 PM

要素の数が固定されていない場合、CSSを介して指定されたクラス名の最初の子要素を選択する方法。 HTML構造を処理するとき、あなたはしばしば異なる要素に遭遇します...

フレックスレイアウト内の紫色のスラッシュ領域が誤って「オーバーフロー空間」と見なされるのはなぜですか? フレックスレイアウト内の紫色のスラッシュ領域が誤って「オーバーフロー空間」と見なされるのはなぜですか? Apr 05, 2025 pm 05:51 PM

フレックスレイアウトの紫色のスラッシュ領域に関する質問フレックスレイアウトを使用すると、開発者ツールなどの混乱する現象に遭遇する可能性があります(D ...

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

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

SVGでタータンパターンを生成する静的サイトを作成する方法 SVGでタータンパターンを生成する静的サイトを作成する方法 Apr 09, 2025 am 11:29 AM

タータンは、スコットランド、特にファッショナブルなキルトに通常関連する模様のある布です。 Tartanify.comでは、5,000を超えるTartanを集めました

See all articles