功能型前端项目技术栈选型

PC功能型官网技术栈选择

  1. vue2+vuex+vue-routerx+axios+animate
  2. 主推:vue3+pinia+vue-router+typeScript+axios+animate(新技术后期踩坑多,成本较高)
1.2 vue3对比vue2
  1. 团队已经熟悉 Vue 2,并且官网的规模不是很大,Vue 2 已经经过多年的发展和完善,有成熟的生态系统和丰富的插件库,可以满足一般官网的需求。此外,Vue 2 的兼容性也更广泛,可以支持更多的浏览器和设备。
  2. 如果官网规模较大,需要更高的性能和更好的开发体验,那么使用 Vue 3 可以提供更好的体验和性能。Vue 3 引入了许多新特性,例如组合 API ,可以提供更好的开发体验。此外,Vue 3 的性能也比 Vue 2 更快,尤其是在处理大型应用时。但是兼容性不如vue2.
  3. Vue3将vue.js拆分成多个文件进行管理,并对代码进行精简,从而进一步缩减了项目体积,相比Vue2打包体积会更小。
  4. Vue3本身就是用Typescript开发的,因此对于Typescript的支持更加友好,vue2并不是很友好还需安装对应的插件。
  5. Vue2它基于对象的方式来组织组件的选项。在Options API中,一个组件被定义为一个包含各种选项的对象,例如data、methods、computed等。而Vue3 使用的是Composition API使用函数的方式来组织组件的逻辑更加灵活和可复用。
1.3 vue2和vue3兼容性

1.vue2只能兼容到IE8就是因为defineProperty无法兼容IE8,其他浏览器也会存在轻微兼容问题 ;

2.proxy的话除了IE,其他浏览器都兼容,vue3还是使用了它,说明vue3直接放弃了IE的兼容性,要求IE浏览器12+起步;

移动端官网技术栈选择

  1. vue2+vuex+vue-router+axios+vant-ui(老技术开发上手快)
  2. vue3+pinia+vue-router+typeScript+axios+vant-ui (如果注重性能和最新的特性,愿意接受一些学习成本,那就Vue 3,新技术后期踩坑多,成本较高)
  3. vue3+vuex+vue-router+axios+vant-ui (单纯vue3技术框架)
  4. uni-app(一套代码打包多端,vue2语法)
  5. Kbone(一份代码,就能够在两端运行,如果你已经有H5代码,只想增加微信小程序平台,并且对性能要求不高,vue2语法)

微信小程序项目技术栈选择

  1. 主推:采用 uni-App开发微信小程序
  2. 原生微信小程开发
  3. Kbone
3.1优缺点
Kbone优点
  1. 跨端能力:Kbone 这个框架可以让你只需要写一份代码,就能够在两端运行,只需要进行一些配置,轻松跑小程序和 Web 两个端。
  2. 性能优化:kbone在底层做了很多性能优化,包括减少小程序和Web应用之间的通信成本、优化渲染性能等,保证了应用的流畅性和响应速度。
  3. 
生态支持:kbone兼容了微信小程序的生态系统,开发者可以使用小程序原生的API和组件,并且可以使用微信开放的能力和服务。
Kbone缺点:
  1. process.env.isMiniprogram判断环境是否是微信小程序,如果是小程序就要用小程序的语法。后期如果有功能改动可能要微信小程序一套逻辑H5一套逻辑。
  2. kbone 是使用一定的性能损耗来换取更为全面的 Web 端特性支持

uniApp的优点:

1.跨平台开发:uniApp可以基于vue开发一次代码,同时适配多个平台,包括

iOS、Android、H5等。uniApp有一个活跃的开发者社区,可以获取到大量的资源和解决方案。

uniApp的缺点:

1.平台限制:由于要兼容多个平台,UniApp在某些功能和性能方面可能会受到一定的限制。

2.自定义性:相比原生开发,UniApp对于一些高度定制化的需求可能会有一些限制。

原生微信小程序的优点:


1. 功能丰富:原生微信小程序可以充分利用微信小程序提供的各种功能和接口,可以实现更复杂的功能和交互。


2. 性能优化:原生微信小程序可以直接使用微信小程序提供的性能优化工具和技术,可以获得更好的性能和体验。


3. 调试方便:原生微信小程序可以使用微信开发者工具进行调试,提供了更便捷的调试和测试环境。

原生微信小程序的缺点:


1. 开发门槛高:原生微信小程序需要使用微信小程序专用的开发语言和API,对于没有相关经验的开发者来说,学习成本较高。


2. 平台限制:原生微信小程序只能在微信平台上运行,无法同时开发其他平台的应用,对于需要跨平台开发的需求不适用。

综合对比

包管理器选型

  1. npm安装、更新和管理项目所需的各种包和依赖项。npm通过命令行界面提供了一系列命令,例如安装包、更新包、删除包等。

  2. cnpm:是一个定制的npm镜像,更快的包安装速度。由于npm默认使用的是国外的源,国内npm可能会比较慢。cnpm通过将npm的源切换到国内镜像来解决这个问题
  3. yarn:使用缓存机制来提高包的安装速度,并允许并行下载和安装包,从而提高了性能。yarn还支持锁定依赖项的版本
  4. pnpm当多个项目使用相同的依赖项时,它们可以共享相同的依赖项,从而减少磁盘空间的占用。pnpm还具有类似yarn的缓存和并行安装的功能,以提高性能。

  5. 结:npm是最常用的JavaScript包管理器,cnpm提供更快的包安装速度,yarn具有更好的性能和版本锁定功能,而pnpm通过共享依赖项减少磁盘空间的占用。

链接入口

动画库:Animate.css | A cross-browser library of CSS animations.

uni-app:uni-app官网

pinia:简介 | Pinia

vant:Vant 3 - Lightweight Mobile UI Components built on Vue

Kbone:kbone 是什么? | wechat-miniprogram / kbone

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/174576.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

使用 Visual Studio Code 编写 TypeScript程序

安装 TypeScript 首先,确保你已经安装了 TypeScript,如果没有安装,请参考https://blog.csdn.net/David_house/article/details/134077973?spm1001.2014.3001.5502进行安装 创建 新建一个文件夹,用vs code打开,在文…

【MySQL--->内外连接】

文章目录 [TOC](文章目录) 一、内连接二、左外连接三、右外连接 一、内连接 内连接就是将两个表连接进行笛卡尔积查询 显示SMITH的名字和部门名称 二、左外连接 左外连接就是以左面的表为主,即便是右边的表没有而左边表项中有的,依然显示 查询所有学…

C# “依赖注入” 中的 “三种生命周期”

🚀简介 依赖注入(Dependency Injection,简称DI)是一种实现控制反转(IoC)的技术,用于减少代码之间的耦合度。通过依赖注入,一个类可以从外部获取其依赖的对象,而不是自己…

评估在线不平衡学习的PAUC

评估在线不平衡学习的PAUC 原始论文《Prequential AUC: properties of the area under the ROC curve for data streams with concept drift》 由于正常的AUC需要计算整体数据集上,每个数据的预测置信度的排名。那么我们首先要求我们的在线学习算法在进行预测时也返…

实体店做商城小程序如何

互联网电商深入各个行业,传统线下店商家无论产品销售还是服务业,仅靠以往的经营模式,很难拓展到客户,老客流失严重,同时渠道单一,无法实现外地客户购物及线上客户赋能等。 入驻第三方平台有优势但也有不足…

审核 Microsoft SQL Server 日志

手动审核数据库活动是一项艰巨的任务,有效完成审计的最佳方法是使用简化和自动化数据库监控的综合解决方案,该解决方案还应使数据库管理员能够监控、跟踪和即时识别任何操作问题的根本原因,并实时检测对机密数据的未经授权的访问。 什么是 S…

Java on Azure Tooling 9月更新|Azure OpenAI 服务和 Playground 支持及更多

作者:Jialuo Gan - Program Manager, Developer Division at Microsoft 排版:Alan Wang 大家好,欢迎阅读 Java on Azure 开发者工具九月份更新。在本次更新中,我们将介绍对 Azure OpenAI 服务和 Playground 的支持,开发…

<C++> vector模拟实现

目录 前言 一、定义命名空间 二、构造函数 三、拷贝构造 四、赋值运算符重载 五、push_back && reserve 六、深拷贝问题 七、iterator 迭代器 1. 可读可写 2. 只读 八、operator[ ] 1. 可读可写 2. 只读 九、insert 问题:内部迭代器失效 十、erase 十一、re…

《RT-DETR改进实战》专栏介绍 专栏目录

《RT-DETR改进实战专栏》介绍及目录 介绍:欢迎来到最新专栏《RT-DETR改进实战》!这个专栏专注于基于 YOLOv8 项目的魔改版本,而不是百度飞桨框架中的 RT-DETR。 本专栏为想通过改进 RT-DETR 算法发表论文的同学设计。每篇文章均包含完整的改…

探讨下前端测试的常见场景

前端测试 场景 这边指的测试是指白盒测试,用代码来测试代码。 测试有利于提升代码质量。 代码功能和需求一致。根据需求,写测试。测试通过了,则表明需求实现了。保证代码重构后,未改坏以前的功能。代码重构后,能通过…

分类预测 | Matlab实现KOA-CNN-BiGRU-selfAttention多特征分类预测(自注意力机制)

分类预测 | Matlab实现KOA-CNN-BiGRU-selfAttention多特征分类预测(自注意力机制) 目录 分类预测 | Matlab实现KOA-CNN-BiGRU-selfAttention多特征分类预测(自注意力机制)分类效果基本描述程序设计参考资料 分类效果 基本描述 1.M…

jenkins详细安装教程

这里写目录标题 一、Jenkins安装与部署1-1、Jenkins的简介1-2、下载需要的软件1-2-1 jekins.war1-2-2 tomcat安装方式 1-3、使用11版本的jdk1-4、开启jenkins1-5、获取密码1-5 修改镜像(可改可不改) 二、卸载Jenkins 一、Jenkins安装与部署 1-1、Jenkins的简介 Jenkins是一个…

Java电商平台 - API 接口设计之 token、timestamp、sign 具体架构与实现|电商API接口接入

一:token 简介 Token:访问令牌access token, 用于接口中, 用于标识接口调用者的身份、凭证,减少用户名和密码的传输次数。一般情况下客户端(接口调用方)需要先向服务器端申请一个接口调用的账号,服务器会给出一个appId和一个key, …

mysql 间隙锁

mysql 默认是可重复读的隔离级别,这种默认会有幻读,幻读指的什么现象呢,就是在同一个事物中前后两次查到的结果不一致,那么mysql是怎么解决幻读的呢,这就是mvcc mvcc 什么是mvcc呢,就是多版本并发控制&am…

迁移学习 - 微调

什么是与训练和微调? 你需要搭建一个网络模型来完成一个特定的图像分类的任务。首先,你需要随机初始化参数,然后开始训练网络,不断调整参数,直到网络的损失越来越小。在训练的过程中,一开始初始化的参数会…

【Python算法】算法练习(一)

❤️博客主页: iknow181 🔥系列专栏: Python、JavaSE、JavaWeb、CCNP 🎉欢迎大家点赞👍收藏⭐评论✍ 目录 1、输出n以内的质数 2、求n以内最大的m个质数的和,并打印这些质数以及它们的和 方法一 方法二…

GaussDB数据库管理系统介绍

1.GaussDB的发展 2.GaussDB的生态 内部: 云化自动化方案。通过数据库运行基础设施的云化将DBA(数据库管理员)和运维人员的日常工作 自动化。外部: 采用与数据库周边生态伙伴对接与认证的生态连接融合方案,解决开发者/DBA难获取、应用难对接等…

2023年【安全员-C证】报名考试及安全员-C证考试内容

题库来源:安全生产模拟考试一点通公众号小程序 安全员-C证报名考试根据新安全员-C证考试大纲要求,安全生产模拟考试一点通将安全员-C证模拟考试试题进行汇编,组成一套安全员-C证全真模拟考试试题,学员可通过安全员-C证考试内容全…

[UDS] --- CommunicationControl 0x28

1 0x28功能描述 根据ISO14119-1标准中所述,诊断服务28服务主要用于网络中的报文发送与接受,比如控制应用报文的发送与接收,又或是控制网络管理报文的发送与接收,以便满足一定场景下的应用需求。 2 0x28应用场景 一般而言&#…

<多线程章节八> 单例模式中的饿汉模式与懒汉模式的讲解,以及懒汉模式中容易引起的Bug

💐专栏导读 本篇文章收录于多线程,也欢迎翻阅博主的其他文章,可能也会让你有不一样的收获😄 🌷JavaSE 🍂多线程 🌾数据结构 文章目录 💐专栏导读💡饿汉模式💡…