React Suspense SSRストリーミング作例|スケルトンUI付きプロンプト
CODE PREVIEW
P
プロンプト
React SuspenseストリーミングSSRのデモページを1つのHTMLで作成。サーバーから段階的にレンダリングされる様子を、スケルトンプレースホルダー付きでシミュレート。遅いコンポーネント(3秒)と速いコンポーネント(1秒)を用意し、骨格→内容が順に表示されるアニメーション。Swiperでカルーセル、GSAPでエントリーアニメ、AOSでスクロールリビール。モダンでクリーンなデザイン。
この1つのHTMLファイルは、SuspenseストリーミングSSRのコンセプトをデモンストレーションします。サーバーがページの各部分を段階的にストリーミングする様子をシミュレート。サイドバー(500ms)、高速コンポーネント(1秒、Swiperカルーセル付き)、低速コンポーネント(3秒)が順に表示され、スケルトンプレースホルダーからコンテンツへと変化します。GSAPがエントリーアニメーションを、AOSがスクロールリビールを担当。
このプロンプトは役に立ちましたか?
コメント
コメントは承認後に表示されます