Skip to content

原文(日本語に翻訳)

WebFetchを改善しました。フェッチしたページから<style><script>の内容を除去するようになり、CSSが重いページが実際のテキストに到達する前にコンテンツ予算を使い果たさなくなりました。

原文(英語)

Improved WebFetch to strip <style> and <script> contents from fetched pages so CSS-heavy pages no longer exhaust the content budget before reaching actual text

概要

WebFetchツールでWebページを取得する際、ページ内の<style>タグのCSS内容と<script>タグのJavaScript内容が自動的に除去されるようになりました。これにより、CSSフレームワーク(Tailwind CSSなど)を大量に含むページや、インラインスクリプトが多いページでも、コンテキスト予算を無駄に消費することなく、実際のテキストコンテンツを効率的に取得できます。

基本的な使い方

WebFetchツールは従来通りに使用できます。スタイル・スクリプトの除去は自動的に行われます。

WebFetch({ url: "https://example.com/documentation" })

改善の効果

改善前(CSS重いページ):

[取得内容の例]
<style>
/* 数千行のCSSフレームワーク */
.container { ... }
.flex { ... }
/* ... 大量のCSS ... */
</style>
→ コンテキスト予算の大部分がCSSで消費される
→ 実際のドキュメント内容に到達できないことがある

改善後:

[取得内容の例]
<style>[スタイル内容は除去されました]</style>
<p>実際のドキュメント内容がここに表示されます...</p>
→ コンテキスト予算を実際のコンテンツに使用できる

実践例

ドキュメントサイトからの情報取得

WebFetch({ url: "https://tailwindcss.com/docs/installation" })
# → TailwindのCSSが大量に含まれていても、インストール手順の
#   テキスト内容を効率的に取得できる

GitHub Pagesサイトの解析

WebFetch({ url: "https://user.github.io/project/" })
# → テーマのCSSに依存するサイトでも実際のコンテンツを取得

SPAアプリケーションのHTML取得

WebFetch({ url: "https://app.example.com" })
# → インラインスクリプトが大量にあるSPAでも
#   メタデータやOGPなどのコンテンツを効率的に取得

注意点

  • <style>タグと<script>タグの内容が除去されます。タグ自体は残ります
  • CSSやJavaScriptの内容自体を分析したい場合は、直接ファイルURLを指定するか、別の方法でアクセスしてください
  • 除去はサーバーサイドレンダリングされたHTMLに対して行われます。動的に挿入されるスタイルは対象外です

関連情報