paint-brush
Web 开发人员与浏览器开发相关的历史经过@taboca
1,019 讀數
1,019 讀數

Web 开发人员与浏览器开发相关的历史

经过 Marcio S Galli9m2023/03/13
Read on Terminal Reader

太長; 讀書

Web 开发人员是网页的构建者。让我们回顾一下它们是如何出现的,以及它们与浏览器历史的联系,比如 Mosaic、Netscape、Mozilla、Firefox。
featured image - Web 开发人员与浏览器开发相关的历史
Marcio S Galli HackerNoon profile picture

Web 开发人员是此类网页的构建者。想想我们在这里是如何合作的:你,在阅读方面,而我,在来自 HackerNoon 的编辑的支持下成为一名更好的作家。


你看到开发商了吗?可能不会,因为他们做得很好。我们很可能会发现他们阅读有关Web 开发未来的文章。


另一方面,我在这篇文章中提供的是一个暂停和反思 Web 开发人员的出现的机会,它与浏览器的历史有何联系,以及他们的合作如何重新点燃了浏览器开发的时间表。

一种新型的网络工程师

本文的主图是由 HackerNoon 的 AI Image Generator 通过提示“a train engineer”生成的。


在web发展初期,很多软件工程师对于网页方面的web开发并没有太多的关注。他们为什么会,对吧?如果你是一名工程师,你会对第一个从机车上下来的乘客印象深刻,还是会对机车本身印象深刻?


来自Fine HyperText Products 之家的Jason Kottke写得很好:


在大学的地下室物理实验室中第一次使用NCSA Mosaic浏览万维网就像我曾经有过的宗教体验一样。这是一个霹雳,彻底改变了我的生活。


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


但是,第一印象也让黑客(和画家)从用户界面方面来研究这个主题。因此,Mosaic 浏览器的发明和革新标志着 Web 发展机遇的开始:


早在 1993 年,国家超级计算应用中心伊利诺伊大学 (NCSA) 发布了第一版 Mosaic 浏览器。该软件在研究界流行的 X Window 系统环境中运行,并提供友好的基于窗口的交互。不久之后,NCSA 也发布了适用于 PC 和 Macintosh 环境的版本。这些流行计算机上可靠的用户友好浏览器的存在对 WWW 的传播产生了直接影响。



请注意浏览器作为一种工具是如何开始发挥重要作用的,因为背后的基础设施显示出了潜力:


1993 年 4 月 30 日,CERN 在免版税的基础上提供了 WorldWideWeb 的源代码,使其成为免费软件。到 1993 年底,已知的 Web 服务器已超过 500 台,WWW 占互联网流量的 1%,这在当时似乎很多(其余为远程访问、电子邮件和文件传输)。


这是一种超现实的体验,因为友好的界面显示了从任何地方获取知识的潜力。也许与我使用 ChatGPT 作为友好界面时的感受没有什么不同,它显示了从任何地方获取知识的潜力。考虑在以下文章中阅读有关 Mosaic 的历史和 Web 的发明:

查看源代码:通过复制示例来学习

但是网页非常简单。当时,我们 - 计算机科学专业的学生 - 会通过页面的简单程度来找到聪明人,就像贝尔实验室的 Dennis Ritchie的页面一样。


当我作为一个好奇的用户在那里时——没有参加计算机科学讲座和玩网络——我也无意中发现了一个菜单选项,合并到浏览器中,使我们能够查看网页的源代码。顺便说一句,几乎在一夜之间,Mosaic 浏览器被称为 Netscape。


Jim Nielsen 在The Spirit of View-Source中反映并确定了 Netscape 浏览器如何为网络上的每个页面提供了一个学习机会 - 瞬间。


在他的文章中,他引用了 Clive Thompson 在《Coders》一书中的观察


您访问的每个网页都包含向您展示其创建方式的代码。整个互联网变成了编程指南的图书馆。



来自 https://blog.jim-nielsen.com/2020/the-meaning-of-view-source/


现在,试着把“网络”想象成周围最热门的东西,想象一下我们中有多少人正在检查页面的来源以复制他人的想法并最终尝试学习。这些是我们可以看到魔法的“查看源代码的日子”。


虽然我们在现代浏览器的菜单中还有“查看页面源代码”,但是如果你查看一个网页的源代码,你很可能会看到一些看起来很神秘的东西:


Markus Spiske 在 Unsplash 上拍摄的照片

JavaScript:控制和交互

另一个众所周知的转折点出现在 Netscape(再次)启用 JavaScript(一种编程语言)时,它允许 Web 开发人员创建脚本来控制网页的某些方面并控制交互。



Brendan Eic h, JavaScript的发明者和Brave Software The Browser That Cares about your Privacy 的现任首席执行官,给了我们一张幻灯片,总结了 JavaScript 在 Web 领域的英雄之旅。他的观点帮助我们看到,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:布局自定义和动画

另一个机会是通过 HTML 中名为 < layer > 的新标记实现的。回到当天,大约在 1997 年,Netscape 推出了 Netscape Communicator Preview Release,其中包含面向开发人员的新 API。根据一份新闻稿,“动态 HTML 是 HTML 的一个重要里程碑,它为设计人员提供了更大的灵活性和对网页布局的控制,同时为用户提供了更大程度的交互性。


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


后来 <layer /> 标签变成了 <div />。当时的技术创新与将 HTML 的视觉片段(一个元素)放置在另一个元素之上的能力有关,如下面最早的 DHTML 技术说明之一中的3D 插图所示。


上面的 3d 图像向开发人员说明了如何将一个元素(例如图形蒙版 GIF)定位为具有更高的 z-index 并在另一个元素之上滑动。


现在,您将无法体验 1997 年的以下演示,但可以尝试想象那列火车(这只是一个图像)正在移动,就好像它正在向您驶来一样。


技巧包括使用 JavaScript 来切换不同尺寸图像的可见性,从而创建动画幻觉。该页面还使用其他一些方法启动了机车的声音。

那时,浏览器大战达到顶峰,像我这样开始为 Netscape 编写页面的开发人员开始为 Internet Explorer 制作页面,这与我不同。这些差异 - 以及所需的技能 - 成为开发人员被聘为 Web 开发人员的原因。 DHTML 运动的规模和复杂性与这本1000 多页的畅销书所写的内容相关。

网络标准

浏览器大战的一个主要结果是 Netscape 将其源代码作为开源发布。这就是名称 Mozilla 出现的地方,如 Project Code Rush中所述。该过程具有战略性、复杂性和风险性。正如当时的首席执行官吉姆巴克斯代尔所承认的那样,这是一个大胆的举动:


“嗯,我当然希望没有任何一家公司能够负担得起从事任何产品的大量新人——现在为 Netscape Navigator Communicator 做出贡献——将对产品的改进产生重大影响。这对任何竞争对手的效果如何,还有待观察。” Jim Barksdale @ Code Rush 2013


除了开源基础之外,Mozilla 的一项关键战略也引起了 Web 开发人员的注意——其 Web 标准支持。为此,Netscape 组建了一个新的技术布道者团队。其中, Eric Meyer是在开发人员中享有名人地位的 CSS 大师。他们的事业与 Web 开发人员的需求产生了共鸣——结束专有差异并有一个共同点来实现适用于所有浏览器的页面。埃里克庆祝了我们的战斗:


“所以这就是 Bob Clary、Marcio Galli、Katsuhiko Momoi、Chris Nalls、Tristan Nitot、Arun Ranganathan、Doron Rosenberg 和 Susie Wyshak。我们打了一场漂亮的仗,创造了很多很棒的材料,包括有关 DevEdge 本身重新设计的信息。


请记住,上面是一张较大照片的一小部分。另一部分是 Mozilla 的文档工作,后来发展成为Mozilla Developer Network。

单页应用程序和 AJAX 方式

当开发人员以符合标准的方式帮助自己修复网页时,他们也在将页面推向极限。在这些日子里,像Gmail 这样的用例出现了,而像Web 服务这样的倡议使我们能够考虑单页应用程序的想法——如果网页可以像软件应用程序一样工作会怎样?以下文章展示了福音传教士当时所写的内容:



尽管做出了这些努力,旧西部也出现了一个转折点。 2005 年,来自旧金山的 Jesse James Garrett 撰写了一篇题为“ Ajax:Web 应用程序的新方法”的开创性文章, Jesse 是一位影响全球 Web 开发的用户体验设计师。 AJAX 成为开发人员用来表达添加交互性和创建 Web 应用程序行为的意图的流行术语。


如果您要雇用某人来创建单页应用程序,则必须雇用了解 AJAX 的 Web 开发人员:


以上是 Jesse James 的 AJAX 原创文章的折叠打印。


开发人员最好的朋友 - 开发人员附加工具和页面检查

Mozilla 项目延续了这一传奇,现在有了 Firefox。 Firefox 继承了 Mozilla 的优点,在性能、安全性和标准支持方面已达到成熟水平。但转折点是,它赢得了开发人员的信任,这并不是因为市场份额,而是因为内置的工具可以帮助他们测试和排除页面故障。


组织的产品经理认识到,确保与 Firefox(标准)的兼容性是将页面传送到 Internet Explorer 的最快方式。



Firefox 作为帮助构建页面的工具 - 由 Web 开发人员使用 - 是一种全球现象,如果你看一下 2008 年 Mozilla 贡献者 Clauber 和 Mario 题为Firefox - Developer's Best Friend 的演讲,你会更好地理解这一点。


在一张关键的幻灯片上,他们陈述了使用 Firefox 作为开发框架的重要性,因为它支持 Web 标准和用于调试 JavaScript 等的开发附加组件。


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

剩下的就是历史了——JS 库和框架

现在,我疯狂地谈论下一步是什么?


决不。如果您是 Web 开发人员,您可能会感受到已经发生的事情的热度和复杂性。让我们在这里结束这场聚会:浏览器在进化,页面在进化,开发人员也在进化。并且要说所有球员都以快节奏做出同样的贡献 - 太快了 - 以至于我更愿意回顾过去并庆祝。


一些注意事项很重要。一是我没有提到服务器端的方面。很难将这种反映与结构相结合,尽管我承认 Web 开发人员分为前端、后端或全栈。


另一个原因是,“Firefox 作为开发人员最好的朋友”的时刻与随网页一起提供的库的兴起同步。一个很好的例子是库jQuery 。因此,“jQuery + Firefox 作为开发人员最好的朋友”的日子确实是一种现象,页面代码开始变得复杂,需要更多的工程角色参与——页面客户端出现更多错误。


这一观察将为考虑 React 等库的出现以及其他主题打开大门,如JavaScript 时代的伟大煤气灯所示的复杂世界。



本文的主图是由 HackerNoon 的AI 图像生成器通过提示“早期互联网浏览器”生成的。