Web标准与前端开发(上) | 青训营笔记

173 阅读2分钟

这是我参与「第四届青训营 」笔记创作活动的的第7天

Web标准与前端开发(上)

起源、架构、变迁

起源

image.png

⭐ 万维网的发明者Tim Berners-Lee在CERN发表了一篇名为Information Management: A Proposal(论文网页版论文PDF版)被公认为Web技术的起源。

"Suppose all the information stored on computers everywhere were lilnked. Suppose I could program my computer to create a space in which everything could be linked to everything. —— Tim Berners-Lee, inventor of the World Wide Web"

⭐ 这篇论文的核心思路为:假设存储在各地计算机上的所有信息都是相通的。假设我可以给我的电脑编程,创造一个空间,在这个空间里,一切都可以连接到一切。

架构

image.png ⭐ 1989年诞生时,Web由三种技术构成:
  • HTML
  • HTTP
  • URL

⭐ CSS和JavaScript是几年之后才出现的。

变迁

image.png

前端应用的领域

浏览器

image.png

⭐ 浏览器,包括桌面浏览器移动浏览器,以及移动APP中的WebView,都属于浏览器直接渲染Web应用的范畴。

⭐ 桌面浏览器包括ChromeEdgeFirefoxOperaSafari这五个主流浏览器,事实上随着谷歌Chromium开源项目的不断攻城掠地,也随着开源运动的不断发展,浏览器的多样性正在减少。因为Edge和Opera都已经选择站到了谷歌的阵营,所有事实上只有Chrome、Safari和Firefox三个浏览器。目前Chrome浏览器的市场份额到了67.55%,具有事实上的垄断地位。

⭐ 移动浏览器主要是ChromeSafari,还有国内小程序提供商定制的一些浏览器引擎。换句话说,前端不仅有开发在浏览器和WebView中运行的网页,也要开发在小程序时上运行的程序。

服务器

image.png

⭐ 服务器,服务端的开发目前还是依托于Node.js这个成熟的JS运行时,npm包管理平台已经成为世界上最大的程序包管理平台,1019年6月超过100万。

⭐ 当然,还有Express、KoaWeb开发框架的生态。

⭐ 大家也要关注Deno这个新的JavaScript安全运行时。而且,Deno也是Node.js之父Ryan Dahl一手打造的。在发布Deno的时候,Ryan Dahl曾经痛陈"Node.js十大遗憾"。

终端和跨端

image.png

⭐ 终端和跨端,这个应用领域通常时开发者工具,目前世界上最流行的编码环境VSCode就是基于Electron的一个Web应用。

语言、框架、工具

image.png image.png image.png

浏览器、网络、服务器

image.png 👉深入理解现代浏览器👈 这篇文章以Chrome作为现代浏览器的示例,图文并茂在讲解了浏览器的工作原理,解释了在地址栏输入URL之后,回车,都会发生什么。

image.png

👉An overview of HTTP👈 这篇文章时HTTP的简介,设计HTTP请求和相应的过程及概念。

学习路线图

image.png