paint-brush
ブラウザ開発に結びついた Web 開発者の歴史@taboca
1,019 測定値
1,019 測定値

ブラウザ開発に結びついた Web 開発者の歴史

Marcio S Galli9m2023/03/13
Read on Terminal Reader

長すぎる; 読むには

Web 開発者は、Web ページのビルダーです。それらがどのようにして誕生したか、そして Mosaic、Netscape、Mozilla、Firefox などのブラウザーの歴史との関係について考えてみましょう。
featured image - ブラウザ開発に結びついた Web 開発者の歴史
Marcio S Galli HackerNoon profile picture

Web 開発者は、このような Web ページの作成者です。ここで私たちがどのように協力しているかを考えてみましょう: 読む側のあなたと私は、HackerNoon の編集者のサポートを受けて、より優れたライターになります。


開発者は見えますか?彼らは良い仕事をしたので、おそらくそうではありません。私たちは彼らがWeb 開発の未来について読んでいるのを目にするでしょう。


一方、この記事で私が提供するのは、Web 開発者の出現、それがブラウザーの歴史とどのように結びついているか、そして彼らのコラボレーションがブラウザー開発のタイムラインにどのように再燃したかについて、立ち止まって考える機会です。

Webのための新しい種類のエンジニア

この記事のリード画像は、HackerNoon の AI Image Generator によってプロンプト「a train Engineer」を介して生成されました。


Web の黎明期、多くのソフトウェア エンジニアは、Web ページに関する Web 開発にあまり注意を払っていませんでした。なぜ彼らはそうするでしょうか?もしあなたが機関士だったら、機関車から来る最初の乗客に感銘を受けますか、それとも機関車自体に感銘を受けますか?


Home of Fine HyperText ProductsJason Kottke は次のように書いています。


NCSA Mosaic を使用して大学の地下の物理学研究室で初めて World Wide Web を閲覧したことは、私が今まで経験したことのないほど宗教的な経験に近いものでした。それは私の人生を完全に変えた落雷でした。


https://kottke.org/12/07/web-browsers-i-have-known-1994-2012


しかし、その第一印象により、ハッカー (およびペインター) は、ユーザー インターフェイスの側面からこの問題にアプローチすることもできました。したがって、Mosaic ブラウザーの発明と革新は、Web 開発の機会の始まりを示しています。


1993 年初頭、国立スーパーコンピューティング アプリケーション センター(NCSA) (イリノイ大学) は、Mosaic ブラウザーの最初のバージョンをリリースしました。このソフトウェアは、研究コミュニティで人気のある X Window System 環境で実行され、フレンドリーなウィンドウベースの対話を提供しました。その後まもなく、NCSA は PC および Macintosh 環境用のバージョンもリリースしました。これらの一般的なコンピューターに信頼性の高いユーザー フレンドリーなブラウザーが存在することは、WWW の普及に即座に影響を与えました。



背後にあるインフラストラクチャが可能性を示したため、ツールとしてのブラウザーがどのように理にかなっているかに注目してください。


1993 年 4 月 30 日、CERN は WorldWideWeb のソース コードをロイヤリティ フリーで利用できるようにし、フリー ソフトウェアにしました。 1993 年末までに 500 以上の既知の Web サーバーがあり、WWW はインターネット トラフィックの 1% を占めていました。これは当時は多かったようです (残りはリモート アクセス、電子メール、ファイル転送でした)。


どこからでも知識にアクセスできる可能性を示したフレンドリーなインターフェースのおかげで、それはシュールな体験でした.どこからでも知識にアクセスできる可能性を示したフレンドリーなインターフェイスとして ChatGPT を使用したときに感じたのと同じかもしれません。次の記事で、Mosaic の歴史と Web の発明について読んでみてください。

ソースを見る: 例をコピーして学ぶ

しかし、Web ページは非常にシンプルでした。当時、私たちコンピュータ サイエンスの学生は、 Bell Labs の Dennis Ritchieのこのページのように、ページがいかにシンプルであるかによって賢い人を見つけていました。


私は好奇心旺盛なユーザーとしてそこにいたので、コンピュータ サイエンスの講義に出席したり、Web で遊んだりしていませんでしたが、Web ページのソースを表示できるようにする、ブラウザに組み込まれたメニュー オプションにも出くわしました。ちなみに、Mosaic ブラウザはほぼ一晩で Netscape と呼ばれるようになりました。


Jim Nielsen はThe Spirit of View-Sourceの中で振り返り、Netscape ブラウザが Web 上のすべてのページに対して学習の機会を瞬時に与えた方法を特定しました。


彼の記事の中で、彼は本Codersの Clive Thompson からの観察を引用しました。


アクセスしたすべての Web ページには、その作成方法を示すコードが含まれていました。インターネット全体が、プログラミングのハウツー ガイドのライブラリになりました。



https://blog.jim-nielsen.com/2020/the-meaning-of-view-source/より


さて、「ウェブ」を最もホットなものとして想像してみてください。そして、ページのソースをチェックして他の人のアイデアをコピーし、最終的に学ぼうとしている人を想像してみてください.これらは、魔法を見ることができる「ビューソースの日」でした。


最新のブラウザーのメニューにはまだ「ページのソースを表示」がありますが、Web ページのソースを表示すると、不思議に見えるものが表示される可能性があります。


UnsplashのMarkusSpiskeによる写真

JavaScript: コントロールとインタラクション

もう 1 つの変曲点は、よく知られているように、Netscape が (再び) JavaScript (プログラミング言語) を有効にしたときに生じました。これにより、Web 開発者はスクリプトを作成して、Web ページの特定の側面を制御し、相互作用を制御できるようになりました。



JavaScriptの発明者であり、 Brave Software The Browser That Cares about your Privacy の現在の CEO であるBrendan Eic h は、Web の国での JavaScript のヒーローの旅を要約したスライドを提供してくれました。彼の指摘は、JavaScript が常にエレガントと見なされていたわけではなく、最終的には頻繁に使用され、改善され続けていたことを示しています。


https://brendaneich.com/wp-content/uploads/2017/12/dotJS-2017.pdf


次のスクリーンショットは、Netscape 2 ブラウザー インターフェイスから呼び出された警告ボックスを示しています。 Web 開発者は JavaScript を使用してビジュアル アラートを起動し (コードをデバッグするため)、Web フォームの制御、入力フォームの値の検証、その他のユース ケースなど、不可能なことを実行しました。


https://webdevelopmenthistory.com/1995-the-birth-of-javascript/ より


言うまでもなく、好奇心旺盛なユーザーは、「ソースの表示」を通じてページ上の JavaScript について学ぶことができます。 HTML ページは、HTML 要素、ハイパーリンク、画像、スタイル、および JavaScript コードを通じて、サイトに関するプレゼンテーションと論理構造を大量に伝えるエンベロープでした。

ダイナミック HTML: レイアウトのカスタマイズとアニメーション

< layer > という名前の HTML の新しいタグによって、別の機会が有効になりました。 1997 年頃、Netscape は開発者向けの新しい API を含む Netscape Communicator Preview Release を開始しました。プレス リリースによると、「ダイナミック HTML は HTML の重要なマイルストーンであり、デザイナーは Web ページ レイアウトをより柔軟に制御できるようになり、ユーザーはより高度なインタラクティブ性を得ることができます。


http://web.archive.org/web/19970303111208/http://www17.netscape.com/newsref/pr/newsrelease354.html


その後、<layer /> タグは <div /> になりました。当時の技術革新は、次の 3D 図が初期の DHTML テクニカルノートの 1 つから示されているように、HTML の視覚的な部分 (要素) を別の要素の上に配置する機能に関係していました。


上の 3D 画像は、グラフィック マスク GIF などの要素をより高い z-index で配置し、他の要素の上にスライドさせる方法を開発者に示しています。


今のところ、1997 年の次のデモンストレーションを体験することはできませんが、その電車 (イメージでした) が近づいてくるように動いていることを想像してみてください。


このトリックは、JavaScript を使用してさまざまなサイズの画像の表示を切り替え、アニメーションのような錯覚を作り出すことで構成されていました。このページでは、他の方法を使用して機関車の音も鳴らしていました。

その時点で、ブラウザー戦争はピークに達し、私のように Netscape 用のページを書き始めた開発者は、私とは異なり、Internet Explorer 用のページを作成し始めました。これらの違いと必要なスキルは、開発者が Web 開発者として雇われる理由として貢献しました。 DHTML 運動の規模と複雑さは、この1000 ページ以上の人気のある書籍の内容と相関しています。

ウェブ標準

ブラウザ戦争の主な結果は、Netscape がそのソース コードをオープン ソースとしてリリースしたことです。 Project Code Rushに記載されているように、ここに Mozilla という名前が表示されます。そのプロセスは戦略的で、複雑で、リスクがありました。当時の CEO である Jim Barksdale が認めたように、これは大胆な動きでした。


「そうですね、1 つの企業がどの製品にも取り組む余裕のない膨大な数の新しい人材が、現在 Netscape Navigator Communicator に貢献しており、製品の改善に大きな違いをもたらすことを願っています。それが競合他社に対してどのように機能するかは、まだわかりません。」ジム・バークスデール @ Code Rush 2013


オープンソース財団とは別に、Mozilla の重要な戦略が Web 開発者の注目を集めました。それは Web 標準のサポートです。これを支援するために、Netscape はテクノロジー エバンジェリストの新しいチームを編成しました。その中には、開発者の間で有名人の地位を獲得した CSS の第一人者、 Eric Meyer がいます。彼らの主張は、Web 開発者のニーズに共鳴しました。つまり、所有権の違いを終わらせ、すべてのブラウザーで動作するページを実装するための共通の基盤を確立することです。エリックは私たちの戦いを祝福しました:


「ボブ・クラリー、マルシオ・ガリ、桃井克彦、クリス・ナルズ、トリスタン・ニトット、アルン・ランガナサン、ドロン・ローゼンバーグ、スージー・ワイシャク。私たちは善戦し、DevEdge 自体の再設計に関する情報を含む、多くの優れた資料を作成しました。


上記は大きな写真の一部であることを覚えておいてください。そのもう 1 つの部分は、後にMozilla Developer Network として成長した Mozilla による文書化の取り組みでした。

シングルページ アプリケーションと AJAX 方式

開発者は、標準に準拠した方法で Web ページを修正するのを手伝っていたので、ページを限界まで押し上げていました。 Gmail のようなユース ケースが出現しWeb サービスのようなイニシアチブによって、単一ページ アプリケーションのアイデアを検討できるようになった時代でした。Web ページがソフトウェア アプリケーションのように機能するとしたらどうでしょうか。次の記事は、伝道者が当時書いていたことを示しています。



これらの努力にもかかわらず、変曲点は旧西部からもやってきました。 2005 年、サンフランシスコの Jesse James Garrett は、「 Ajax: Web アプリケーションへの新しいアプローチ」という重要な記事を書きました。Jesse は、世界中の Web 開発に影響を与えたユーザー エクスペリエンス デザイナーでした。 AJAX は、対話機能を追加して Web アプリケーションの動作を作成するという意図を伝えるために、開発者が使用する一般的な用語になりました。


シングルページ アプリケーションを作成するために誰かを雇う場合、AJAX を知っている Web 開発者を雇う必要がありました。


Jesse James の AJAX の元の記事の折り目の上の印刷物。


開発者の親友 - 開発者アドオン ツールとページ インスペクション

Mozilla プロジェクトは、現在 Firefox でこの物語を続けています。 Firefox は Mozilla の商品を引き継いでおり、パフォーマンス、セキュリティ、および標準サポートの面で準備ができているレベルに達しています。しかし、転機となったのは、市場シェアではなく、ページのテストとトラブルシューティングに役立つ組み込みツールのおかげで、開発者の信頼を獲得したことです。


組織の製品マネージャーは、Firefox (標準) との互換性を確保することが、ページを Internet Explorer に配信する最速の方法であることを認識していました。



Web 開発者が使用するページの作成を支援するツールとしての Firefox は、世界的な現象であり、Mozilla の貢献者である Clauber と Mario によるFirefox - Developer's Best Friend というタイトルの 2008 年のプレゼンテーションを見ると、よりよく理解できます。


重要なスライドで、Firefox を開発フレームワークとして使用することの重要性を述べました。これは、Web 標準のサポートと、JavaScript などのデバッグ用の開発アドオンがあるためです。


https://pt.slideshare.net/clauber.halic/firefox-developers-best-friend-fisl2008

あとは歴史 - JS ライブラリとフレームワーク

さて、次のことについて話すのは気が狂っていますか?


とんでもない。あなたが Web 開発者であるなら、あなたが知っていることの熱気と複雑さを感じているかもしれません。このパーティーをここで締めくくりましょう。ブラウザは進化し、ページは進化し、開発者も進化しました。そして、すべてのプレイヤーが同じように速いペースで貢献していると言うことは、あまりにも速すぎて、私が過去を振り返って祝うことを好む点です.


いくつかの注意事項が重要です。 1つは、サーバー側の側面について言及していなかったことです。 Web 開発者がフロントエンド、バックエンド、またはフルスタックとして分岐したことは認めますが、その反省を構造に組み込むのは難しいでしょう。


もう 1 つの理由は、「開発者のベスト フレンドとしての Firefox」と示された瞬間が、Web ページと共に出荷されるライブラリの台頭と同期したことです。良い例はライブラリjQueryです。したがって、「開発者のベスト フレンドとしての jQuery + Firefox」の時代は、ページのコードが複雑になり始め、より多くのエンジニアリングの役割が必要になり、ページのクライアント側にバグが増える現象でした。


その観察は、React のようなライブラリの出現や、他の主題の中でも特に、 JavaScript 時代の偉大なガスライティングによって示される複雑な世界を検討するための扉を開くでしょう。



この記事のリード画像は、HackerNoon のAI Image Generatorによってプロンプト「初期のインターネット ブラウザー」を介して生成されました。