前端培训PPT.ppt_第1页
前端培训PPT.ppt_第2页
前端培训PPT.ppt_第3页
前端培训PPT.ppt_第4页
前端培训PPT.ppt_第5页
已阅读5页,还剩6页未读 继续免费阅读

下载本文档

版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领

文档简介

前端工程化历程 现代前端框架思想 前端工程化 1 前端代码结构以及模块化2 渲染方式以及模板3 组件4 前端路由与前端应用5 CSS解决方案6 异步流程处理7 构建工具 前端代码结构与模块化 第一阶段htmljscss代码分离 jscss分层切割在不同文件中 统一在html引入 以闭包和命名空间划分彼此 第二阶段动态创建标签引入js 实现模块化加载 例如 requireJS 这段时期提出了AMD CMD等加载方式的概念 前端代码结构与模块化 第三阶段引入node用于编译代码 基于commonjs标准 像写node一样写浏览器端代码 例如 browserify 第四阶段一切资源皆是模块 支持es6模块 node 按需加载 代码分割 环境变量 版本号等等 例如 webpack 渲染方式 第一阶段命令式 直接操作DOM 例如 jQuery第二阶段声明式 仅描述数据与UI的映射关系 DOM操作交给库 框架 例如 Vue react 模板 第一阶段字符串模板 字符串拼接 输出html第二阶段模板引擎 例如 Handlebars第三阶段模板 虚拟DOM Diff 数据 DOM 组件 第一阶段DOM组件 将DOM操作集成在组件对象中 例如 jQueryui bootstrapjavascript组件第二阶段controller 模板 将数据与视图绑定 例如 Backbone第三阶段组件可以表示为函数 组件可以由其他组件组装而成 结合变化侦测 虚拟DOM Diff 提升效率 例如 React Vue 前端路由与前端应用 组件可以表示为一个函数一个大型组件可以由很多小组件拼装而成多个大型组件可以构成应用路由表示一个前端应用那么路由也可以表示为一个函数 CSS解决方案 第一阶段按照约定的规则 写CSS代码 例如 BEM第二阶段结合构建工具进行预处理 例如 Less Sass PostCSS第三阶段契合组件 样式与组件绑定 例如 cssinjs CSSmodules 异步流程处理 第一阶段基于回调函数第二阶段基于Promise对象第三阶段基于生成器 async await rxjs 构建工具

温馨提示

  • 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

评论

0/150

提交评论