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原生语句开销高很多
当用innerhtml更新dom时，会销毁所有旧dom，然后创建所有新dom，因此开销较大
方法2 虚拟dom操作dom
创建虚拟dom树，遍历虚拟dom树找到目标dom，创建/更新目标dom
和js相比，虚拟dom多出了虚拟dom树构建与遍历的开销
运行时和编译时
类似于解释和编译，选择哪种方式。
框架设计核心要素
提升用户开发体验
vue报错会有一些用户友好的warn等，可以容易发现问题所在，而不是js原生报错，难以定位问题
控制框架代码体积
vue的warn的入参有个__DEV__，这个在vue用rollup.js构建时会输出两个版本，分别用于开发与生产，不同版本会设置__DEV__为True False，提高了代码使用效率
tree-shaking
tree-shaking指去除框架中用不到的代码
关于框架构建产物
特性开关
错误处理
良好的typescript类型支持
设计思路
声明式描述UI
就是用js对dom进行变量定义
渲染器
函数，可以入参虚拟dom和dom挂载点，在函数内部处理虚拟dom，变为真实dom
组件本质
模板工作原理
vuejs是模块组成的有机整体
相关文章：
vue设计与实现-框架设计
权衡的艺术 命令式和声明式 视图层框架通常分为命令式和声明式，各有优缺。jquery是一种命令式框架。命令式框架关注过程，而声明式框架关注结果。对于vue来说，过程被vue封装了，所以vue内部是命令式的，但vue暴露给用户…...
Stable Diffusion和Midjourney有什么区别？
Stable Diffusion 和 Midjourney 主要有以下区别： 目录 费用与可访问性 设备要求 安装与使用 学习成本 图像生成效果 可控性与定制性 私密性 费用与可访问性 Stable Diffusion：开源免费，任何人都可以免费下载并自行部署使用…...
即插即用，无痛增强模型生成美感！字节跳动提出VMix:细粒度美学控制，光影、色彩全搞定
文章链接：https://arxiv.org/pdf/2412.20800 代码地址：https://github.com/fenfenfenfan/VMix 项目地址：https://vmix-diffusion.github.io/VMix/ 亮点直击 分析并探索现有模型在光影、色彩等细粒度美学维度上生成图像的差异，提出…...
面向对象分析和设计OOA/D，UML，GRASP
目录 什么是分析和设计？ 什么是面向对象的分析和设计？ 迭代开发 UML 用例图 交互图 基于职责驱动设计 GRASP 常见设计原则 什么是分析和设计？ 分析，强调是对问题和需求的调查研究，不是解决方案。例如&#x…...
【每日学点鸿蒙知识】广告ID、NFC手机充值、CSS支持语法、PC与模拟器交互、SO热更新等
1、HamonyOS 样机获取成功返回Oaid为00000000-0000-0000-0000-000000000000？ 请求授权时需要触发动态授权弹窗,看一下是不是没有触发授权弹窗。 可以参考以下代码以及文档： // ets import identifier from ohos.identifier.oaid; import hilog from oh…...
30分钟学会HTML
HTML 基本语法 HTML（HyperText Markup Language）是构成网页内容的基础。它使用一系列的标签来描述网页的结构，包括文本、图片、链接等元素。浏览器会解析这些标签并渲染成我们看到的网页。 在线体验一下 CodePen (在线 HTML 编辑器)。 千万不…...
服务器信息整理：用途、操作系统安装日期、设备序列化、IP、MAC地址、BIOS时间、系统
文章目录 引言I BIOS时间Windows查看BIOS版本安装日期linux查看BIOS时间II 操作系统安装日期LinuxWindowsIII MAC 地址IV 设备序列号Linux 查看主板信息知识扩展Linux常用命令引言 信息内容：重点信息：用途、操作系统安装日期、设备序列化、IP、MAC地址、BIOS时间、系统 Linux…...
Golang设计模式目录
go语言实现设计模式 1 文章目录： 1.1 创建型模式 1.Golang设计模式之工厂模式2.Golang设计模式之抽象工厂模式3.Golang设计模式之单例模式4.Golang设计模式之建造者模式5.Golang设计模式之原型模式 1.2 结构型模式 6.Golang设计模式之适配器模式7.Golang设计模式之桥…...
选择IT驻场外包公司，要找有哪些资质的公司
在当今数字化快速发展的时代，IT驻场外包服务成为众多企业优化运营、提升竞争力的关键选择。无论是初创企业寻求技术起步支持，还是大型企业为降低成本、专注核心业务而将部分 IT 职能外包，IT 外包公司都扮演着至关重要的角色。然而，…...
Java List 集合详解：基础用法、常见实现类与高频面试题解析
正文 在 Java 集合框架中，List 是一个非常重要的接口，广泛用于存储有序的元素集合。本文将带你深入了解 List 接口的基本用法、常见实现类及其扩展，同时通过实际代码示例帮助你快速掌握这些知识。 👉点击获取2024Java学习资料 1…...
Arduino UNO 驱动1.8 TFT屏幕显示中文
背景 最近入手了一块1.8寸的tft屏幕，通过学习文档，已经掌握了接线，显示英文、数字、矩形区域、划线、画点等操作， 但是想显示中文的时候操作比较复杂。 问题 1、arduino uno 驱动这款屏幕目前使的是自带的<TFT.h> 库操作…...
Flink operator实现自动扩缩容
官网文档位置： 1.Autoscaler | Apache Flink Kubernetes Operator 2.Configuration | Apache Flink Kubernetes Operator 1.部署K8S集群 可参照我之前的文章k8s集群搭建 2.Helm安装Flink-Operator helm repo add flink-operator-repo https://downloads.apach…...
分布式系统架构6：链路追踪
这是小卷对分布式系统架构学习的第6篇文章，关于链路追踪，之前写过traceId的相关内容：https://juejin.cn/post/7135611432808218661，不过之前写的太浅了，且不成系统，只是简单的理解，今天来捋一下…...
vite-plugin-imagemin安装问题
vite-plugin-imagemin 是一款图片资源压缩插件，能够在打包的时候显著的降低图片资源占用。不过，在安装过程中我们遇到了如下的问题。 对于上面的问题，有以下几种常见的解决方案： 1，使用 yarn 在 package.json 内配置(推荐) 打开 package.json 配置文件，然后添加如下脚本…...
Git revert回滚
回退中间的某次提交（此操作在预生产分支上比较常见），建议此方式使用命令进行操作（做好注释，方便后续上线可以找到这个操作） Git操作： 命令：revert -n 版本号 1：git re…...
永磁同步电机预测模型控制（MPC)
永磁同步电机预测模型控制（MPC) 文章目录 前言1、模型预测控制1.1 连续控制集模型预测控制（CCS-MPC）1.2 有限控制集模型预测控制（FCS-MPC）1.3 模型预测控制的优缺点 2、永磁同步电机模型预测控制2.1 预测模型2.2 价值…...
【JAVA】switch ... case ... 的用法
语法结构： switch(表达式){ case 值1： 表达式和值1匹配时执行的语句 break; case 值2： 表达式和值2匹配时执行的语句 break; …...
基于STM32的热带鱼缸控制系统的设计
文章目录 一、热带鱼缸控制系统1.题目要求2.思路3.电路仿真3.1 未仿真3.2 开始仿真，显示屏显示水温、浑浊度、光照强度等值3.3 当水温低于阈值，开启加热并声光报警3.4 当浑浊度高于阈值，开启自动换水并声光报警3.5 当光照低于阈值，…...
Vue项目整合与优化
前几篇文章，我们讲述了 Vue 项目构建的整体流程，从无到有的实现了单页和多页应用的功能配置，但在实现的过程中不乏一些可以整合的功能点及可行性的优化方案，就像大楼造完需要进行最后的项目验收改进一样，有待我们进一步…...
WinForm开发-自定义组件-1. 工具栏: UcompToolStrip
这里写自定义目录标题 1. 工具栏: UcompToolStrip1.1 展示效果1.2 代码UcompToolStrip.csUcompToolStrip.Designer.cs 1. 工具栏: UcompToolStrip 自定义一些Winform组件 1.1 展示效果 1）使用效果 2）控件事件 1.2 代码 设计 编码 UcompToolStrip.…...
龙虎榜——20250610
上证指数放量收阴线，个股多数下跌，盘中受消息影响大幅波动。 深证指数放量收阴线形成顶分型，指数短线有调整的需求，大概需要一两天。 2025年6月10日龙虎榜行业方向分析 1. 金融科技 代表标的：御银股份、雄帝科技 驱动…...
微软PowerBI考试 PL300-选择 Power BI 模型框架【附练习数据】
微软PowerBI考试 PL300-选择 Power BI 模型框架 20 多年来，Microsoft 持续对企业商业智能 (BI) 进行大量投资。 Azure Analysis Services (AAS) 和 SQL Server Analysis Services (SSAS) 基于无数企业使用的成熟的 BI 数据建模技术。 同样的技术也是 Power BI 数据…...
React Native 开发环境搭建（全平台详解）
React Native 开发环境搭建（全平台详解） 在开始使用 React Native 开发移动应用之前，正确设置开发环境是至关重要的一步。本文将为你提供一份全面的指南，涵盖 macOS 和 Windows 平台的配置步骤，如何在 Android 和 iOS…...
为什么需要建设工程项目管理？工程项目管理有哪些亮点功能？
在建筑行业，项目管理的重要性不言而喻。随着工程规模的扩大、技术复杂度的提升，传统的管理模式已经难以满足现代工程的需求。过去，许多企业依赖手工记录、口头沟通和分散的信息管理，导致效率低下、成本失控、风险频发。例如&#…...
-----深度优先搜索（DFS）实现)
c++ 面试题(1)-----深度优先搜索（DFS）实现
操作系统：ubuntu22.04 IDE:Visual Studio Code 编程语言：C11 题目描述 地上有一个 m 行 n 列的方格，从坐标 [0,0] 起始。一个机器人可以从某一格移动到上下左右四个格子，但不能进入行坐标和列坐标的数位之和大于 k 的格子。 例…...
ffmpeg（四）：滤镜命令
FFmpeg 的滤镜命令是用于音视频处理中的强大工具，可以完成剪裁、缩放、加水印、调色、合成、旋转、模糊、叠加字幕等复杂的操作。其核心语法格式一般如下： ffmpeg -i input.mp4 -vf "滤镜参数" output.mp4或者带音频滤镜： ffmpeg…...
Caliper 配置文件解析：fisco-bcos.json
config.yaml 文件 config.yaml 是 Caliper 的主配置文件，通常包含以下内容： test:name: fisco-bcos-test # 测试名称description: Performance test of FISCO-BCOS # 测试描述workers:type: local # 工作进程类型number: 5 # 工作进程数量monitor:type: - docker- pro…...
PHP 8.5 即将发布：管道操作符、强力调试
前不久，PHP宣布了即将在 2025 年 11 月 20 日 正式发布的 PHP 8.5！作为 PHP 语言的又一次重要迭代，PHP 8.5 承诺带来一系列旨在提升代码可读性、健壮性以及开发者效率的改进。而更令人兴奋的是，借助强大的本地开发环境 ServBay&am…...
LOOI机器人的技术实现解析：从手势识别到边缘检测
LOOI机器人作为一款创新的AI硬件产品，通过将智能手机转变为具有情感交互能力的桌面机器人，展示了前沿AI技术与传统硬件设计的完美结合。作为AI与玩具领域的专家，我将全面解析LOOI的技术实现架构，特别是其手势识别、物体识别和环境…...
Python 高效图像帧提取与视频编码：实战指南
Python 高效图像帧提取与视频编码：实战指南 在音视频处理领域，图像帧提取与视频编码是基础但极具挑战性的任务。Python 结合强大的第三方库（如 OpenCV、FFmpeg、PyAV），可以高效处理视频流，实现快速帧提取、压缩编码等关键功能。本文将深入介绍如何优化这些流程，提高处理…...