前端发展历史和现主流框架对比ppt课件_第1页
前端发展历史和现主流框架对比ppt课件_第2页
前端发展历史和现主流框架对比ppt课件_第3页
前端发展历史和现主流框架对比ppt课件_第4页
前端发展历史和现主流框架对比ppt课件_第5页
已阅读5页，还剩14页未读， 继续免费阅读

下载本文档

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

文档简介

1、,前端发展历史和现主流框架对比,制作人：郑锦鹏 2017/12/16,目录,Contents,web前端历史,history,1、网页三剑客（Firework、Dreamweaver、Flash），ie浏览器时代 2、新版浏览器时代，html5，响应式布局网页，前后端分离，ajax异步请求，jsjq需要兼容各种浏览器 3、2012年后，前端开发框架时代（angular、react、vue），前端单页面应用+路由，按需加载（require、sea），前端自动化工具(grunt、gulp、webpack)，新版es6语法，,jquery工具库与前端框架对比,jquery（必学）： 1、是一个将军，

2、专注的是每个战场细节上的战术安排。 2、一个完善的工具库，兼容各种浏览器，由各种复用的函数集成，非常便捷的修改页面元素。 3、面向dom开发，数据结构一变，view层也要重新维护。,框架（以react为例）： 1、是一个元帅，考虑的是整个战局大体上的战略规划。 2、组件式开发，整个UI是一个通过小组件构成的大组件，每个组件只关心自己部分的逻辑，彼此独立。 3、面向state开发，让开发者更多的关注数据， 底层数据变化时，自动处理所有界面的更新。,单页面应用开发,以往页面是用iframe来做页面路由，现在用框架适配的路由,前端三大框架之间的关系,angular,vue,react,组件间数据交互

3、,一、父子，兄弟,二、全局数据管理器,1、angular （1）注册单例factory，注入到controller中； （2）每个controller都可监听广播事件，发送向上、向下和全局的广播，$broadcast，$emit，$on，$watch,3、vue （1）vuex管理库，借鉴redux而创造出的和vue更加契合的,2、react （1）redux管理库，函数式编程， 自定义listener, 通过action来改变数据，同时执行相关listener函数 （2）mobx管理库，,框架 同步数据到视图,实现原理： 1、定义一个变量， 2、监听这个变量的每次获取和赋新值， 3、然后同步

4、到视图,angular 脏检查 同步数据,双向数据绑定是 AngularJS 的核心机制之一。 view 中有任何数据变化时，会更新到 model ， model 中数据有变化时，view 也会同步更新,1、Angular 在 scope 模型上设置了一个 监听队列，用来监听数据变化并更新 view 。 2、每次绑定一个东西到 view 上时 AngularJS 就会往 $watch 队列里插入一条 $watch，用来检测它监视的 model 里是否有变化的东西。 3、当浏览器接收到可以被 angular context 处理的事件时，$digest 循环就会触发，遍历所有的 $watch，最后更新 dom。,虚拟dom: 检测虚拟dom变化后，渲染到真实dom,mobx，前端适配库，js语言自带的拦

人人文库> 全部分类> 教育资料 > 课件下载

温馨提示

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

最新文档

评论

0/150

提交评论