当前位置：网站首页 > 技术文章 > 正文

HTML+JS框架下开发与VUE框架下开发最基础的区别

myzbx 2024-12-30 05:31 59 浏览

今天我来谈谈我对传统HTML与VUE的区别理解(不谈太深的区别，查了一下网上那些说的都一样，我只谈很多人最关心的不一样的，说不对请理解,对不太了解或想了解VUE的人)。

1、什么是vue

官网介绍：vue是一套构建用户界面的渐进式框架。它与其他重量级框架不同的是，vue采用自下而上增量开发的设计。Vue的核心库只关注视图层，非常容易学习，非常容易与其他库或已有项目整合。

Vue的目标是通过尽可能简单的API实现响应的数据绑定和组合的视图层组件。

2、什么是HTML(HTML5)

HTML5是Web中核心语言HTML的规范，用户使用任何手段进行网页浏览时看到的内容原本都是HTML格式的，在浏览器中通过一些技术处理将其转换成为了可识别的信息。

总结：它们相同的地方就一句话:用途和结果都是一样的，不管是VUE还是HTML，最终都是将数据使用各种UI及方式展现给用户，也就是都是视图层页面的。

有人会说使用HTML和VUE开发有什么区别呢？许多人觉得结果都是视图层表达，而且VUE打包发布后不还是HTML+一堆JS文件，而且还要引入导入编译感觉特麻烦，感觉VUE好难，为什么要学VUE？

1、开发和部署

VUE 开发过程确实挺麻烦的，要安装依赖，要npm一堆包(还经常失败)。而HTML就简单多了，直接就拿来主意，下载下来，改改就用。

部署的话都差不多，都是在任何服务上都可以直接使用，而且都没有什么依赖。

但是我觉得VUE的开发类似于开发一个APP，所以他的打包结果是比纯HTML+JS更安全的，相当于做过混淆，因而他发布后的体积更小。

2、数据通讯

HTML+JS 数据POST,GET 等基本访问方式，但是如果直接在HTML中使用数据判断，或数据循环输出必须借助js,jquery等通过前端处理然后对id进行赋值操作，所以一般只能借助动态语言如php,java,.net等语言环境进行转化，但这样使得web对动态语言环境依赖性过强，造成后端迁移时太过于复杂，而且这样的Web一般要求前端和后端部署在一起。

VUE则不依赖于动态语言输出环境，只要是双方约定了数据传输接口，服务器放在哪里，不管使用什么后台语言都没关系，因而他的灵活性更强。

3、安全性

有些产品有些公司对语言是有选择的，主要是不想让代码暴露太多，而HTML+JS的方式往往是达不到要求的，因而现在许多企业还是在使用桌面软件的形式，又或者是要你使用对方的云服务，而私有云部署则要贵的很多，而且比较贵的软件还要安装秘钥软件，加密狗等方式，无非就是防止你将软件转移或无限使用或获取他的核心算法（虽然js也是有混淆方法的，但很少有人会这么做，我也没试过但是很影响效率）。

以前我在一个公司就是加班写了一个WEB程序里边有一个算法是分析公司产品结构的（那时VUE还不盛行），正好呢又遇到一个懂点的老板(居然会用F12)，结果看到核心代码了，当时就否定了，改用了WinForm 重写，那个辛苦你懂的。

VUE的打包的话，其实就是根据在页面中所使用到的组件然后根据你的逻辑关系等进行混淆打包，然后在用户加载时按需进行加载解析，从某种意义上来说做WEB是一种保护。我觉得这与桌面程序及APP打包效果是一样的(软件和APP也是可以反编译嘛，反编译后的结果就是混淆)，当然不说加密混淆了。

现在国内出现了像DCloud、APICloud（虽然这二家经常打架，毕竟相似度很高，我不做评论，但不可否认对一个只会写HTML+JS的人转写APP是一个不错的选择）这些由HTML5开始的跨平台软件也开始支持VUE了。

最后附上VUE打包后的调试预览图，纯HTML的就不多说了，自己F12吧。

HTML5 支持

上一篇：从Windows1.0到Windows10，《微软扫雷》进化
下一篇：HTML5传统外国大厂显身手_2014安卓浏览器半年度横评

HTML+JS框架下开发与VUE框架下开发最基础的区别

相关推荐

使用VSCode模板提高Vue开发效率（vscode开发vue3）

吃透 Vue 项目开发实践|16个方面深入前端工程化开发技巧【下】

移动前端重构实战系列:5-7章（前端移动端主要技术有哪些）

说下你的vue项目的目录结构，该怎么划分?

8.7k star，一款超炫酷的动态可视化大屏项目

这么牛逼的cursor功能，赶紧用起来

用上Vue3，你真的变了吗?（vue3 key）

20个免费音乐音效下载网站，无版权素材商业影片也可用

什么是“恒定光圈”，什么是“浮动光圈”?-摄影早自习第331

comfyui安装MimicMotion扩展，AI跳舞动作模仿