Speculation Rules APIをAIで実装！コピペ可能なプロンプト作例

このプロンプトは、ブラウザのSpeculation Rules APIを題材にしたインタラクティブなデモページをAIに一括生成させる指示です。「ホバーでprefetch/prerenderの状態表示」「統計パネル」「コードブロック」という具体的なUI要素を列挙することで、曖昧な解釈を排除し、実用的な学習ツールとして機能するアウトプットを得られます。

フロントエンドの新しいWeb APIを社内勉強会や技術ブログで紹介したい場面に適しており、ChatGPTやClaudeなどコード生成が得意なモデルと相性が良いです。「prerenderをprefetchに限定する」「特定のURLパターンのみマッチさせる」など条件を追記するだけで、応用範囲を柔軟に調整できます。