vue(1)-学习历程之vue解决jquery的什么痛点

vue解决jquery的痛点

首先我们需要明白和理解jquery和vue的设计初衷和理念。

  1. jquery官网给出的开篇介绍是,jquery是一个快,小,功能丰富的js库,它让html文档遍历和操作,事件处理,动画,以及ajax等提供了简单易用的API,并且可以在众多浏览器中使用。

    jQuery is a fast, small, and feature-rich JavaScript library. It makes

    things like HTML document traversal and manipulation, event handling,

    animation, and Ajax much simpler with an easy-to-use API that works

    across a multitude of browsers.

    所有js库要解决的问题*: 简单语法(查找DOM元素,对DOM元素进行操作)解决浏览器兼容性问题

    jquery这个js库比其他js库受欢迎的地方在于:所有一切都在jquery对象里面,入口是查询,结果是操作

    库,开发者自由控制,搭建前端

  2. Vue (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式框架
    所有js框架要解决的问题*: 应对需求变化,防止大面积重写。让开发者遵循框架的规范和规则构建项目,追求高效,团队协作,代码利用率和可扩展性
    vue这个js框架比其他js框架受欢迎的地方在于:

    组件化:一个大型页面切分成一个一个更小的可控单元;方便后续优化,使用组件可以降低模块耦合度,组件所依赖的资源全部封装在组件内部调用。

    数据侦听,双向绑定:(js中有两种方法可以侦测到变化,object.defineProperty和ES6的proxy)vue使用的是object.defineProperty.
    我们之所以要观察一个数据,是为了当数据发生变化时,可以通知到使用该数据的地方。先把使用该数据的地方收集起来(术语是收集依赖getter),当变化时,再触发依赖setter
    依赖收集到哪,数组Dep,存储依赖。
    数据变化时,我们需要集中通知给各个地方,让中介watcher来通知吧

    客户端路由:单页面应用,不做就不需要,一个url对应一个应用

    大规模状态管理: 应用简单时,一个基础状态和界面映射就可以解决问题,应用很大时,涉及多人合作,需要多个组件之间共享,多个组件需要去改动同一份状态,如何使大规模应用高效运行。

    构建工具:打包和工程构建

渐进式vue框架,自底向上增量开发,为什么选择vue而不是jquery

  1. 你不想用vue的数据驱动DOM变化,不想组件化,那你可以用vue当成一个js库来使用,简单的收集form表单,表单验证。如果你碰到多次改需求,你会发现vue要改的代码比jquery少的多。
  2. 大胆一些,你想把整个页面的dom用Vue来管理,如新闻列表用v-for来循环,评论交互有些复杂,你抽象成小组件,这个过程就会把关注点从原来的jquery dom操作变成关注数据变化。于是你开始用虚拟dom,数据双向绑定,差量更新
  3. 你要做个webApp,于是你了解webpack vue-router,你发现前端可以控制路由了,vue-router单页面却可以切换组件,不是f5刷新的感觉
  4. 滚动播放视频,前端和后端的接口沟通很频繁,大量的数据在组件中共享,你找解决方法,发现vueX处理数据在组件之间流动得心应手。
  5. 慢慢的你开始关注用户数据增长,你发现第2部,新闻列表和评论整个页面用vue管理开发很方便,但是页面白屏时间长,类似这样的底层页对seo很不好。你开始考虑vue 2.0的SSR。为了保证团队高质量输出,你开始研究给vm写单元测试….

综以上5点,我真的不知道有什么理由不用vue,因为你用了vue,你也可以用jquery啊,在vue中什么时候用Jquery会更高效,答案是动画。因为vue侧重数据。

参考文献:

  1. vue渐进式框架理解:https://www.zhihu.com/questio…
  2. vue核心功能原理解析https://www.cnblogs.com/dhsz/…
  3. 百度网盘视频学习以及源码资源https://pan.baidu.com/s/1bpD6hUR 提取密码 aebz
    原文作者:蒙奇D颖
    原文地址: https://segmentfault.com/a/1190000016009262
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞