Toggle JavaScript は、現在のブラウザタブの JavaScript 実行をワンクリックで無効化または再有効化します。結果を確認するためにページが自動的にリロードされます。JavaScript なしでのページの動作を確認 — progressive enhancement のテスト、サーバーサイドレンダリングの検証、JS 依存機能のデバッグ、または検索エンジンクローラーがコンテンツをどのように見るかの確認に使用します。
Chrome で JavaScript を無効にするには通常、chrome://settings にアクセスし、複数のメニューを操作してトグルを切り替え、ページをリロードする必要があります。しかもすべてのタブで JavaScript が無効になり、他に開いているサイトが壊れる可能性があります。DevSuite Pro の Toggle JavaScript はタブごとに機能し、ワンクリックで操作できます。現在のタブで JavaScript をオフにするとページがリロードされ、no-JS バージョンが表示されます。他のすべてのタブは通常通り動作し続けます。これは progressive enhancement のテスト（JS なしでサイトは機能するか？）、SSR/SSG レンダリングの検証（検索エンジンクローラーは何を見ているか？）、JavaScript エラーのデバッグ（JS なしで問題は解消するか？）、そして noscript フォールバックのテストに不可欠です。もう一度クリックして再度オンにすると — ページが完全な JavaScript 機能でリロードされます。
ワンクリックで現在のタブの JavaScript を無効化します。ページが自動的にリロードされ、no-JS バージョンが表示されます。もう一度クリックで再有効化。トグルの状態が明確に表示されます（JS ON / JS OFF）。
現在のタブにのみ影響します。他のタブ、他のウィンドウ、他のサイトは通常通り JavaScript を実行し続けます。1 つのタブで JS を無効にしながら、別のタブで JS を有効にすることも可能です。
変更が確実に反映されるよう、切り替え後にページが自動的にリロードされます。手動でのリフレッシュは不要 — no-JS または JS 有効バージョンが即座に読み込まれます。
JavaScript なしで利用可能なコンテンツ — 検索エンジンクローラー（初回の HTML のみのパスにおける Googlebot）が見るものと同じビュー — を正確に確認します。重要なコンテンツがサーバーレンダリングされており、クライアント専用でないことを検証します。
JavaScript なしでサイトのコア機能が動作するかテストします。JS が無効な場合でも、フォームは送信でき、リンクは遷移でき、コンテンツは読める状態であるべきです。
JS が無効な場合、何が影響を受けるかのサマリーが表示されます：動的コンテンツは読み込まれず、SPA はナビゲートできず、フォームのクライアントサイドバリデーションが機能せず、インタラクティブウィジェットは静的になります。何を期待すべきかを把握するのに役立ちます。
検索エンジンはすべてのクロールで JavaScript を実行するわけではありません。JS を無効にして、Googlebot の初回 HTML パスが何を見るかを確認します。JS なしでコンテンツ、meta タグ、リンクが欠落している場合、インデックスされない可能性があります。
JavaScript なしでサイトのコア体験が機能するかを検証します。低速な接続のユーザー、JS ブロッカーを使用しているユーザー、または支援技術を利用しているユーザーは、あなたの no-JS バージョンに遭遇する可能性があります。
ページが壊れている — JavaScript エラーなのか CSS/HTML の問題なのか？JS を無効にします。問題が続く場合は JS 関連ではありません。消えれば、バグが JavaScript コードにあることがわかります。
JavaScript が利用できない場合に noscript タグと no-JS フォールバックコンテンツが正しく表示されることを検証します。ユーザーが空白のページではなく、意味のあるメッセージを見られるようにします。
JavaScript を一切実行しない場合のページ読み込み速度を確認します。これにより HTML/CSS レンダリングのベースラインパフォーマンスが示され、JavaScript が初期読み込みをどれほど遅延させているかの特定に役立ちます。
DevSuite Pro のポップアップを開き、Toggle JavaScript アイコンをクリックします。現在の JS の状態が表示されます。
トグルをクリックして JavaScript を無効化します。ページがリロードされ、no-JS バージョンが表示されます。トグルには赤で「JS OFF」と表示されます。
JavaScript なしでページを閲覧します。コンテンツが表示されているか、ナビゲーションが機能するか、フォームが動作するかを確認します。何が壊れるか、または機能が低下するかに注意してください。
もう一度トグルをクリックして JavaScript を復元します。ページが完全な JS 機能でリロードされます。
DevSuite Pro を無料でインストールして、ブラウザで 39 以上の開発者ツールを利用しましょう。
