前端诞生与发展历史
前端(用于渲染)运用范围:
网页(html+css)
app(1原生开发(react nactive) 2混合开发(uniapp))
小程序(微信小程序 qq轻应用... 第三方平台开发)
小游戏(canvas 画布)(游戏可以理解为逐帧加入图片的连续动画)
大屏喀什话(图表 canvas)
gui(图形化界面桌面应用)现已逐渐退环境
相关技术
html(结构)生成DOM树
css(修饰)生成css规则树
dom树+css规则树=渲染树(Render Tree)
JavaScript(脚本)JavaScript解析会阻塞渲染树,拖慢浏览器画面呈现速度
诞生
刚开始是后端但因为那时候还没有前端这一清晰定义所以后端囊括了现在全栈的所有工作
前端刚开始称之为前端切片(在国内起步发展重要原因是随着阿里巴巴的崛起与大火,前端用于给淘宝店铺或着给公司页面进行装修)
重大事件:
国内 15年左右阿里巴巴的员工尤雨溪开发出了现在国内热门的Vue框架
国外在12年左右谷歌公司开发的便已有angular以及随后13年facebook开发出的react
这三种是目前主流使用的框架
浏览器
ie firefox chrome microsoft-edge O鹏 sarafi
W3C组织(早期微软的ie没有加入导致ie低版本具有兼容问题)
谷歌
v8引擎(解析速度目前最快,microsoft-edge也是这个引擎)
解析器(JavaScript)
编译器(java,c,python...)
编译器的代码执行过程为:
由源代码语法分析再到ast抽象语法树再到中间代码再到变成2进制文件让计算机执行(源代码到生成.xxx文件后缀再到2进制文件给计算机执行)速度比解析器快
解析器代码执行过程为:
源代码到ast抽象语法树再到字节码然后直接执行
浏览器包含了哪些东西:
主进程(管理对应的窗口,每开一个就创建一个进程)
GPU进程(处理对应的复杂画面提供硬件支持,主要是硬件支持)
渲染进程(主要为实时渲染)
插件进程(提供插件运行)
渲染进程:
GUI渲染线程(html,css)——>JS引擎线程(JS脚本解析与运行)——>时间触发线程(事件触发,如设置click,setTimeout,ajax)——>定时触发线程(给setTimeout和setinterval计时的)——>异步http请求线程(开新线程进行异步请求)
注意事项:1.js->promise->html->setTimeout.2.GUI线程只能有一个.3.GUI与JS不能同时进行,两者互斥关系,必须等GUI执行完才能进行JS.