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

91 阅读2分钟

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

一、关于前端开发

1. 起源、架构、变迁

1.1 起源

Information management : A Proposal

1.2 架构

image.png

1.3 变迁

bcb40279ac38ad3db5ca7e5993f4b23.jpg

敏捷时代的转折点是由于苹果手机的出现,移动端的发展使得开始重视用户体验,由此,前端的重要性得到重视,从后端中独立出来,成为独立的版块,有了前端工程师职业。

2. 前端应用领域

71081e7d3609e10369ccdfd89fd7516.jpg

  • To B 面向企业
  • To C 面向客户
  • To D 面向开发者自己
2.1 浏览器

桌面浏览器包括谷歌(Chrome),Edge,火狐(Firefox),欧朋(Opera),Safari 这五大浏览器,但从内核上讲,现在只有三大浏览器了,Edge和Opera已经进入了谷歌阵营,谷歌浏览器占比达到69.28%,处于垄断地位。

2.2 服务器

网站服务器:  能够提供网站访问服务的机器就是网站服务器,它能够接收客户端的请求,能够对请求做出响应。

node.js、express.js、koa

2.3 终端和跨端

1e23d327889643d0d161eceed889431.jpg

3. 前端开发:语言、框架、工具

3.1 前端开发语言

  • HTML
  • CSS
  • JavaScript
  • WebAssembly

3915989d4fdb312d550b38160eb7b4c.jpg 其中,HTML负责网页构建,CSS负责样式,JS负责实现网页动态化,而WebAssembly是一种新的编码方式,能在新的浏览器中运行,类似汇编语言,能以接近原生的速度运行,能和JS互相传输数据,共享内存,浏览器的运行速度会更快。

3.2 框架

b6276c3b96f8b956fed96f12b9eb6c1.jpg (课堂老师建议:先了解框架作者,写框架的初衷)

4.前端开发:浏览器、网络、服务器

4.1 浏览器

推荐文章:深入理解现代浏览器

08a93175964b4761042330f8701b981.jpg

4.2 网络

推荐文章:An overview of HTTP

image.png

5. 前端学习路线

推荐网站:学习路线图

a5a4e7533495fdc2f99479920ac79bd.jpg

二、Web标准

1. 标准组织

  • W3C:World Wide Web Consortium——万维网联合会
  • Ecma:Ecma International——Ecma国际
  • WHATWG:Web Hypertext ApplicationTechnology Working Group Web——超文本应用技术工作组
  • IETF:Internet Engineering Task Force互联网工程工作队

2. Web 标准生命周期

W3C流程文档规定了W3C作为中立的技术交流平台的运行规则。

9015c5b57a8f289ed214216f9465ace.jpg W3C制定流程:

image.png

Ecma TC39规范制定流程:

image.png

  • 以任何形式提交想法
  • 提出特征正式建议
  • 形成具有语法语义的描述
  • 规范文本 两个实现
  • 形成标准

image.png

2.关注会议

2.1 W3C会议

  • 年度大会
    • AC(Advisory Committee)
    • TPAC(Technical Plenary and Advisory Committee)
  • 工作组会议
    • 每月研讨会 2.2 Ecma会议
  • 年度大会
  • TC39会议

总结与思考

通过这节课的学习,我了解了Web标准和前端的学习流程,能够帮助我更加系统的学习前端技术,形成完备的知识体系,有利于今后学习工作的进步。