Jquery会死吗?我为什么不用vue写富文本!
一、事件背景:
我最近开源了一个个人耗时半年打造的富文本及一套适用于web后台的ui框架,在gitee上受到网友们的关注,部分网友对我采用jquery的技术栈提出了质疑。总结起来:无非是jquery已经落后,不久将死。甚至有少数网友很激进:非vue技术栈,你不应该加入我这个群,不管你做得多好。对应这个事情,首先我一般不反驳,因为我对vue,jquery有自己的应用场景度量。但是对于这种不分场景应用而盲目赶潮流的观点,我是持否定态度的。
为此我想有必要通过这篇文章,说明一下:我为什么用jquery来写vue和web后端ui框架,而不用vue。在文章开始前,先贴一下我开源的富文本:
gitee: https://gitee.com/kevin-huang/Bui-Editor-public
浮动文本/图片/视频功能

绘制流程图功能

移动设备模拟功能

通过上述富文本的截图,可以大概了解到这个富文本的功能很丰富,许多功能可以说是全网富文本里面的only-one。这么复杂的应用对技术栈的选择很重要,良好适配的技术栈可以在设计上,编码上给开发者更大的自由度,同时可以避免很多繁杂的实现,提升代码质量,降低后期的维护,运营的成本。
二、我的观点:
1、vue技术栈适用于移动端应用开发,对于pc端web应用,vue技术栈并不见得优于传统技术栈(相对于vue来说是传统的)。
2、jquery是目前dom操作的王者,除此无二,jquery和vue不可比较,他们各自擅长的场景不一样。
3、复杂应用,原生JavaScript + jquery是比较好的技术栈组合,优于vue技术栈。
三、jquery、vue技术栈诞生背景,擅长场景说明
jquery:
诞生背景
1、jquery诞生于2006年,它诞生的背景是浏览器的dom操作繁杂,各种浏览器api不统一。市场需要一个前端JavaScript库解决dom操作的痛点。
2、jquery诞生的年代,移动应用还在萌芽,它的设计实现都是面向pc端的,当时的前端技术范畴也还没有mvvm(数据驱动)的思想,它为操作dom而生。
擅长场景:
dom操作为主的场景,如富文本,流程设计器,这些应用需要对dom进行大量的操作,jquery最合适不过。
对于这种场景,vue的编程规范会造成设计实现上的束缚,其双向绑定在这里也是多余的,完全没有用武之地!
缺点:
1、jquery没有mvvm思想,不能解决移动端带宽、性能的痛点。
2、jquery没法实现数据驱动开发,还需要开发者编写dom读写操作。
vue:
诞生背景
1、vue的诞生之前,已经有了许多成熟的mvvm框架,如backbone、angular,他们都是在一些数据驱动的需求场景中得到很好的应用,但也并没有像vue被开发者如此着迷。
2、backbone、angular既然已经有了数据驱动的实现,为何没有像vue那样火呢,因为他们要么比较笨重,要么还没有解决移动端应用的痛点(带宽、性能)。
3、vue可以说是为移动应用而生,轻量,其设计的虚拟dom解决移动设备频繁触发浏览器刷新而引起的性能/电量问题,其设计的单页打包(webpack)模式,解决了跳转需要网络请求的带宽痛点。
擅长场景:
1、数据驱动的双向绑定场景,特别是表单读写,可以说解放了表单读写对dom的操作编程。
2、移动应用场景,通过双向绑定,虚拟dom、webpack打包,解决移动端web应用的设备性能/电量、带宽痛点。
缺点:
1、采用数据驱动,没有灵活的dom操作,不适用于dom操作为主的应用场景。
2、在复杂应用中,大量的dom监听、data状态联动维护并不是一种好的机制。
3、webpack打包方式解决了移动应用的痛点,但也带来了发布后,难以跟踪定位问题,没法即刻修改已经在线页面的缺点。
4、学习成本相对传统技术栈高一些,对团队的前端知识要求也相对高一些。
四、vue应用场景说明
pc端web应用场景
1、pc端没有移动端性能、带宽的限制,采用vue技术栈,反而带来了开发环境繁杂、学习额外的非w3c规范的web知识、发布后难以定位跟踪问题、没法即刻修改在线页面这些缺点。
2、pc端的应用,大多是普通的表单开发应用,除此之外基本都是展示类型的页面,个人认为除了表单的双向绑定,监控类ui的数据联动,其他如ui表现/结构的编程采用vue有点多余。
移动端应用场景
1、移动应用场景,对性能、带宽有要求,移动设备的特点也决定了其在问题跟踪定位,更新部署方面与pc端有差异。
2、vue技术栈应用于移动应用场景具有天生的设计实现优势。
我的总结:
1、 pc端采用传统的ui技术栈,同时在传统的基础上引入轻量级mvvm方案解决表单读写开发编程,即优于vue技术栈。这也Bui会实现一个min-mvvm的初衷。
2、移动端应用,毫无疑问,采用vue技术栈是王道。
欢迎登陆我的demo网站,体验可能是全网最强大的富文本应用:
Jquery会死吗?我为什么不用vue写富文本!的更多相关文章
- vue项目富文本编辑器vue-quill-editor之自定义图片上传
使用富文本编辑器的第一步肯定是先安装依赖 npm i vue-quill-editor 1.如果按照官网富文本编辑器中的图片上传是将图片转为base64格式的,如果需要上传图片到自己的服务器,需要修改 ...
- Vue之富文本tinymce爬坑录
前言 最近因业务需求在项目中嵌入了tinymce这个富文本编辑器,用于满足平台给用户编辑各类新闻内容什么的业务需求,前后也花了不少时间体验和对比了市面上各类开源编辑器. *案例demo版本:vue-t ...
- Vue tinymce富文本编辑器
tinymce 官方为 vue 项目提供了一个组件 tinymce-vue 一.安装tinymce-vue npm install @tinymce/tinymce-vue -S 二.下载tinymc ...
- vue v-html 富文本解析 空格,换行,图片大小问题
1.保留空格,换行属性 //保留换行空格问题 white-space: pre-wrap; 2.超出部分,强制换行,一般用于数字 //富文本换行 word-wrap: break-word; tabl ...
- vue修改富文本中的元素样式
富文本编辑器目前应用很广泛,而有时候我们想要对其中的一些元素的样式进行修改,就会遇到问题. 首先,直接修改是不可行的,因为是用v-html标签进行渲染的,无法直接获取到. 在修改的时候,一般是按标签进 ...
- vue显示富文本
来源:https://segmentfault.com/q/1010000013952512 用 v-html 属性解决
- vue集成百度UEditor富文本编辑器
在前端开发的项目中.难免会遇到需要在页面上集成一个富文本编辑器.那么.如果你有这个需求.希望可以帮助到你 vue是前端开发者所追捧的框架,简单易上手,但是基于vue的富文本编辑器大多数太过于精简.于是 ...
- Vue基于vue-quill-editor富文本编辑器使用心得
vue-quill-editor的guthub地址,现在市面上有很多的富文本编辑器,我个人还是非常推荐Vue自己家的vue-quill-deitor,虽然说只支持IE10+,但这种问题,帅给别人吧! ...
- 在 Vue 项目中引入 tinymce 富文本编辑器
项目中原本使用的富文本编辑器是 wangEditor,这是一个很轻量.简洁编辑器 但是公司的业务升级,想要一个功能更全面的编辑器,我找了好久,目前常见的编辑器有这些: UEditor:百度前端的开源项 ...
随机推荐
- PHP中读写文件
在PHP中读写文件,可以用到一下内置函数: 1.fopen(创建文件和打开文件) 语法: 复制代码代码如下:fopen(filename,mode) filename,规定要打开的文件.mode,打开 ...
- PHP留言小练习
实现功能: 留言.搜索.编辑.删除.详情页.时间.点击量 页面划分: index.html(留言列表页) add.html(留言页) edit.php(编辑页) del.php(删除页) view.p ...
- hyperledger fabric学习(1)
第一部分 环境搭建 说明 本次环境搭建是是现在虚拟机中,采用ubuntu 16.04版本,安装多次成功. 首先安装一些常用的工具 sudo apt-get update sudo apt-get in ...
- 基于STM32的uCGUI移植和优化
基于STM32的uCGUI移植和优化 首先在开始这个说明之前,要简要说明下具体的环境: 编译工具:MDK4.20 开发板:安富莱v2版开发板 调试器:JLink v8盗版 移植篇 相信大家有移植经验 ...
- [转] 编写高效的 CSS 选择器
高效的CSS已经不是一个新的话题了,也不是我一个非得重拾的话题,但它却是我在Sky公司工作之时,所感兴趣的,关注已久的话题. 有很多人都忘记了,或在简单的说没有意识到,CSS在我们手中,既能很高效,也 ...
- ffmpeg 合并文件
ffmpeg文件合并 文件1.ts~ 100.ts 流媒体文件1.txt 格式 file .ts file .ts ... file .ts 命 令 (-vcodec copy -acodec ...
- 【opencv学习笔记三】opencv3.4.0数据类型解释
opencv提供了多种基本数据类型,我们这里分析集中常见的类型.opencv的数据类型定义可以在D:\Program Files\opencv340\opencv\build\include\open ...
- android学习点滴一:android环境的搭建
东一点西一点,很多时间都浪费了.是该系统性的做好自己的东西了. <android学习点滴一:android环境的搭建> [环境变量]变量名:JAVA_HOME变量值:C:\Java\jdk ...
- MySQL 之 扩展例子
扩展例子 插入一条记录 INSERT INTO 表名 [(字段1,…,字段n)] VALUES (值1,…,值n) 插入查询的结果 INSERT INTO 表名 (字段1,…,字段n) VALUES ...
- 下载win7/win8/win10镜像
关于给电脑换系统,很多人会花钱去电脑店里换,或者是下载Ghost系统.但这些系统都不是微软原版的,制作者已经集成了很多常用软件或垃圾软件进去.我在这给大家介绍的是如何下载正版的Windows系统.这个 ...