现在前端开发越来越复杂,好多项目都需要借助框架和工具才能高效的完成。以下是对目前一些框架的收集。

Web开发框架React

一个用于构建用户界面的JavaScript框架,注重数据不可变、虚拟 DOM 和运行时,生态完善,前端第一框架。

Svelte

运行时都非常轻量级,侧重在于编译时的优化;2019年发布,目前处于蓬勃发展阶段vue弹窗组件,其中专注于编译优化,采用 rust 重写工具链。再应用 Wasm方面 Svelte 有自己独特优点。

Angular

Google基于TypeScript的开发,基于面向对象分层结构,适合大型 Web 应用程序,学习曲线相对陡峭。特点在抽象这个维度又走向一个极致。

Vue

Vue 最初基于解决 Angular 弊端而开发。 使用简单,学习曲线友好。Vue 在每个维度之间,做了非常好的权衡和取舍,算是一个非常中庸且优雅的框架,兼顾响应式、虚拟 DOM、运行时和编译优化。

特别说一下 Vue 3 继承了 Vue 2 的响应式、虚拟 DOM,组件化等所有优秀的特点,但是全部重新设计,解决了这些历史包袱的新框架,是一个拥抱未来的前端框架

Vue 国内用的比较多vue弹窗组件,生态逐渐完善,是一个还在成长一个框架。

UI 组件库

国内用的最多的是分别是:Element UI 、Ant Design 、IView

UI组件

组件数量

单测

管理方

背景

特点

缺点

Element UI

55

81%

vue-element-admin 社区

饿了么

UI漂亮,容易上手

组件层级管理只针对弹窗级别

Ant Design

57

87%

Pro社区

蚂蚁金服

适合复杂后台系统,可配置化强

组件可定制化低,部分组件个别特性bug修复慢

IView

43

iView-admin

TakingData

颗粒度较细,针对组件定制化

层级维护较为零散,排查问题时比较麻烦

可视化图表1、AntV

AntV是蚂蚁金服所提供的一套全新的视图可视化图表库, 与Echart虽然都为图表库, 但是从实质出发还是存在一定的差异性, Echarts是以图表为主, 而 Antv 则是以图形出发。

echarts 相对于antv来说是比较成熟的一套图表库, 使用方便、图表种类多, 也是比较容易上手的, 遇到问题网上的解决方式也有很多,而antv是以数据可视化底层引擎,以数据驱动, 相对于echart更具有拓展性和灵活性。

2、ECharts

ECharts,一个使用 JavaScript 实现的开源可视化库,可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE8/9/10/11,Chrome,Firefox,Safari等),底层依赖轻量级的矢量图形库 ZRender,提供直观,交互丰富,可高度个性化定制的数据可视化图表。

ECharts 提供了常规的折线图、柱状图、散点图、饼图、K线图,用于统计的盒形图,用于地理数据可视化的地图、热力图、线图,用于关系数据可视化的关系图、旭日图,多维数据可视化的平行坐标,还有用于 BI 的漏斗图,仪表盘,并且支持图与图之间的混搭。

测试框架

Jest 是facebook推出的一款测试框架,集成了Mocha,chai,jsdom,sinon等功能。

打包构建工具

Rollup、Webpack、Vite

Rollup 更适合打包库,Webpack更适合打包项目,Vite基于Rollup实现了热更新也适合打包项目。

目前 Webpack 应用比较广泛,未来应该属于 Vite (vue作者尤雨溪开发)。

Webpack 和 Vite 相比有明显的性能差距

Vite 采用了ES模块来实现模块的加载。目前基于web标准的ES模块已经覆盖了超过90%的浏览器。

WebGlThree.js

Three.js是一个轻量级的跨浏览器JavaScript库,应用比较广泛的,用于在浏览器中创建和显示动画3D计算机图形。其历史几乎和 WebGL 一样长,它早在 2010 年 7 月 7 日就支持 WebGL 渲染了,那个时候 WebGL 规范还在草案中,要等到 2011 年 3 月才正式发布,恐怕这就是为什么提到 WebGL 大家都会想到 Three.js,它大概是第一个支持 WebGL 的引擎

Cesium

Cesium 和T hree.js 一样3D可视化的,并且都是用JavaScript从头开始构建的,所以它们具有相似之处,Cesium是一个为创建数字地球而开发的3D库,其渲染与真实地球惊人地精确。

Babylon.js

babylon.js是一个完整的JavaScript框架,用于构建HTML5,WebGL,WebVR和Web Audio的3D游戏和体验. 除了游戏用来在页面实现一些3D场景也是没问题的。

Three.js VS Babylon.jsThree.js和Babylon.js 都是对于Webgl的封装,Three.js比较早,使用人数和社区活跃度都比Babylon高,Babylon开发过程中,大部分情况下只能去官方的社区去提问或者去找对应的问题,好在官方的社区回复的速度还是挺快的.2个框架在功能全面性一致,Babylon.js 可以使用 webgpu. 性能更好。源码方面 Babylon 基于 Typescript,three.js 大部分代码还是 es5。WASM 框架Yew

Yew是一个现代的 Rust 框架,用于使用 WebAssembly 创建多线程前端Web应用程序,Yew 就像 React 那样,使用类似 JSX 的语法开发页面,同时支持 class 和函数式两种组件编写方式。

Blazor WebAssembly

使用 Blazor WebAssembly,开发人员可以在浏览器中运行 .NET 代码。 它是一种单页应用框架,使用的是 WebAssembly 开放标准,无需插件或代码生成。

在浏览器中通过 WebAssembly 执行的 .NET 代码在浏览器的 JavaScript 沙盒中运行。 该代码具有沙盒提供的所有安全和保护特性。 这有助于防止客户端计算机上的恶意操作。

限 时 特 惠: 本站每日持续更新海量各大内部创业教程,一年会员只需98元,全站资源免费下载 点击查看详情
站 长 微 信: muyang-0410