vue设计与实现-权衡的艺术

命令式和声明式

视图层框架通常分为命令式和声明式,各有优缺。jquery是一种命令式框架。命令式框架关注过程,而声明式框架关注结果。对于vue来说,过程被vue封装了,所以vue内部是命令式的,但vue暴露给用户是声明式

性能与可维护性权衡

结论:声明式的性能不优于命令式。

因为声明式多了封装的开销,可以这么理解

那vue仍使用声明式的意义,就是保持注重结果同时减小封装开销

虚拟dom性能

虚拟dom是为了找出声明式和命令式之间的最小开销差而出现的

可以看到,虚拟dom理论上性能并不比js高,因为js是命令式。虽然命令式理论上性能好,但人们很难写出性能很ok的命令式代码,即使做到了也会消耗不少精力。有没有什么方法可以用较少精力还能保证性能不下降?这是虚拟dom要解决的问题

原生js不包含innerHTML方法,这个方法比较特殊

例子 比较innerHTML和虚拟dom性能,创建一个dom

方法1 js定义字符串dom,然后用innerHTML方法解析字符串dom

性能分析:dom操作开销比js原生语句开销高很多

方法2 虚拟dom创dom

相关推荐
带娃的IT创业者12 小时前
WeClaw-TTS 语音合成实战:pyttsx3 本地引擎与 Edge-TTS 云服务的混合架构.md
前端·tts·ai智能体·openclaw·weclaw
gCode Teacher 格码致知12 小时前
Javascript提高:Promise、Fetch、Axios、XHR、jQuery AJAX 完整对比-由Deepseek产生
javascript·ajax·jquery
计算机学姐12 小时前
基于SpringBoot+Vue的智能民宿预定游玩系统【AI智能客服+数据可视化】
java·vue.js·spring boot·后端·mysql·spring·信息可视化
鹏程十八少12 小时前
5.Android 如何用腾讯Shadow在双11电商场景的完整复盘(实战2年),实现热修复(全网最详细实战案例)
android·前端·面试
wl851112 小时前
SAP HCM 公积金超过上限后的计税方案
前端·html
二月夜12 小时前
Vue项目打包为WAR文件部署Tomcat完整指南
前端·vue.js·tomcat
终端鹿12 小时前
Vue3 核心 API 完结篇:toRaw / markRaw / shallowReactive / shallowRef 等进阶响应式 API 详解
前端·javascript·vue.js
bigcarp12 小时前
edge浏览器IE模式(Internet Explorer 兼容)-tplink摄像头需要
前端·edge
276695829212 小时前
悟空租车帮app最新登录算法
开发语言·前端·python·悟空app·租车帮·租车帮app·租车帮登录逆向
摇滚侠12 小时前
微信小程序是前端,也需要 Java 开发的后端服务
java·前端·微信小程序