Mozilla と Google は、開発者がより効率的に Web サイトを作成およびデバッグできるようにするための機能を追加してブラウザを更新しました。
火曜日にリリースされたFirefox 23では、MozillaがWeb Developer Toolbarにいくつかの機能を導入しました。また、GoogleもChrome Developer Toolsの機能を発表しました。
どちらのテクノロジ セットも、静的な Web ページの表示を超えて、ユーザーとサービス間のより豊富なインタラクションを実現するためにブラウザがますます使用されるようになっていることを認識しています。
「私たちは今でもブラウザ言語を使っていますが、人々が行うことのほとんどはブラウジングではありません。メール、カレンダー、ソーシャルネットワーキングなど、全く異なる種類のアクティビティです」と、MozillaのFirefoxエンジニアリング担当副社長、ジョナサン・ナイチンゲール氏は述べた。
ジョアブ・ジャクソンFirefox 23では、Web開発者ツールバーにブラウザ内コードデバッガーをカスタマイズするための新しいオプションパネルが追加されました。ユーザーは、独自のキーボードショートカット、外部コード検証ツール、構文ハイライトの色など、さまざまなオプションを指定できます。
このオープンソースブラウザには、ネットワークモニターも搭載されており、ページのダウンロード時にブラウザが実行するすべてのアクション（読み込み時間やソースコード処理時のエラーなど）を表示します。以前はブラウザのWebコンソールにこの情報が表示されていましたが、視覚的に直感的ではありませんでした。
モジラウェブ開発者にとって興味深い点として、Firefox 23ではHTML5フォームコントロールで様々な値をサポートできるようになりました。中間者攻撃から保護するためのコンテンツブロッキング機能も備えています。また、多くの批判を浴びていた点滅効果と点滅要素のサポートも廃止されています。
Google も Web 開発者に注目しており、Google Chrome ブラウザに組み込まれた Web 作成およびデバッグ ツールのセットである Chrome Developer Tools (DevTools) を更新しています。
おそらく最も注目すべきアップデートは、Workspaces の導入です。これは、新しく編集した Web ページを確認するために外部のコード エディターとブラウザーを切り替えるという、小さいながらも頻繁なプロセスを排除できる組み込みのソース コード エディターです。
ワークスペースを使用すると、開発者はDevToolsコンソールを使用してブラウザ内から直接Webページを編集できます。変更が成功した場合は、ディスクに書き戻すことができるため、外部エディタやIDE（統合開発環境）を開く必要がなくなります。
「これにより、スクリプトやスタイルを作成、調整し、その変更がブラウザに反映されるのを即座に確認し、透過的にディスクに保存できるようになります」と、Chrome DevTools チームの Google ソフトウェア エンジニアである Vsevolod Vlasov 氏は、このアップデートを発表するブログ投稿で書いています。
Chrome エディタは、PHP、Python、Java、CSS、HTML、JavaScript の構文の強調表示をサポートしています。
アップデートされたDevToolsにより、開発者はプリプロセス済みのCSSファイルもライブ編集できるようになりました。CSSプリプロセッサは、CSSコードをより使いやすく理解しやすい形式に整理する特別な言語です。
このリリースでは、DevTool は人気の Sass プリプロセッサをサポートし、Google は Less、Stylus、Compass プリプロセッサのサポートも追加することを約束しています。
DevToolsでは、スクリプト、ブックマークレット、ユーティリティを保存できるようになりました。これにより、ブラウザでソースコードを編集する際に、すぐに呼び出すことができます。Googleはスニペットのコミュニティリポジトリも用意しています。
