前端资源库整理

红太狼 2023-10-05 01:54 6阅读 0赞

### 学习资料 ###

[URL][]: 包括各种cypress测试用例

[学习资料汇总][Link 1]： 各种学习资料

[vue源码][vue]：vue源码的深入刨析

[PWA][]: PWA学习资料

[图说设计模式][Link 2]： 设计模式学习资料

[函数式编程][Link 3]： 函数式编程学习理解

[blob数据类型][blob]： 各种支持类型

[colorhunt][]： 配色网站

### 常用库： ###

**[Echarts][]:** 是一款基于js的数据可视化图表库，提供直观，生动，可交互，可个性化定制的数据可视化图表.

[tweenmax][]：是GreenSock 动画平台中的核心动画工具，可用来构建补间动画(tween)。

[spritejs][]：SpriteJS 是跨平台的高性能图形系统，它能够支持web、node、桌面应用和小程序的图形绘制和实现各种动画效果。在浏览器端支持 webgl2 渲染，并可向后兼容降级为 webgl 和 canvas2d。

vxe-table：丰富的表格组件

[DataV][]: 组件库基于Vue （React版） ，主要用于构建大屏（全屏）数据展示页面即数据可视化，具有多种类型组件可供使用：

### 工具库： ###

[Umi][]: Umi 是蚂蚁金服的底层前端框架，已直接或间接地服务了 3000+ 应用，包括 java、node、H5 无线、离线（Hybrid）应用、纯前端 assets 应用、CMS 应用等。

**[html2canvas][]：**浏览器上拍摄网页或其中一部分的“屏幕截图”。屏幕截图基于DOM。

**[log-viewer][]：**日志组件，处理特殊字符高亮， 高性能。

**[Lodash][]:** 是一个js实用工具库，提供一致性，及模块化、性能和配件等功能。而简化了 JavaScript、 数字、对象、字符串等的处理。

**[postcss-px-to-viewport][]：**将px单位转换为视口单位的 (vw, vh, vmin, vmax) 的 [PostCSS][] 插件.如果你的样式需要做根据视口大小来调整宽度，这个脚本可以将你CSS中的px单位转化为vw（大屏数据展示）

### **常用类：** ###

**[Rxjs][]: R**xJS 是使用 Observables 的响应式编程的库，它使编写异步或基于回调的代码更容易

**[bluebird][]:** 功能齐全的Promises / A +实现，具有出色的性能。

### 实用小工具： ###

[imgcook][]: 由设计稿一键智能生成代码

[RGB][]: 颜色转换工具

[photopea][]：网页版的ps工具

### 流程图绘图框架： ###

**[gojs][]:** GoJS是一个JavaScript和TypeScript库，用于构建交互式图和图.提供了用于用户交互的高级功能,从简单的流程图和组织结构图到高度特定的工业图，SCADA和BPMN图，医学图（如基因图和爆发模型图），等等。GoJS使用可自定义的模板和布局使构建复杂节点，链接和组的图变得容易。目前闭源收费

[jsplumb][]:是一套开源的流程图创建工具， 小巧精悍使用简单，有社区版和收费版

[JointJS][]：是一个开源的绘图组件，基于JavaScript的图表库，可以用来创建静态图表、完全可交互的图表、 [WEB在线流程图][WEB]、应用程序

[mxGraph][]: mxGraph(http://jgraph.github.io/mxgraph/)：mxGraph是一个js绘图组件，适用在网页设计/编辑流程图、图表、网络图和普通图形的web应用程序，draw.io工具就是基于mxGraph开发的。缺点就是介绍框架简介以及API文档不全，社区问题也较少更新；  
[GG-Editor][]: GG-Editor是基于 G6 和 React 的可视化图编辑器，G6 是一个图可视化引擎。它提供了图的绘制、布局、分析、交互、动画等图可视化的基础能力。

[antv/x6][antv_x6]: X6 是 AntV 旗下的图编辑引擎，提供了一系列开箱即用的交互组件和简单易用的节点定制能力，方便我们快速搭建 DAG 图、ER 图、流程图等应用。

[LogicFlow][]: 滴滴旗下，专注于流程图

网络安全相关：

[别人的优秀总结][Link 4]

### 参考收藏库： ###

[别人的收集][Link 5]

###  ###

[URL]: https://github.com/reireynoso/cypress-practice
[Link 1]: https://github.com/justjavac/free-programming-books-zh_CN
[vue]: https://book.penblog.cn/
[PWA]: https://lavas-project.github.io/pwa-book/chapter02/1-what-is-good-ux.html
[Link 2]: https://design-patterns.readthedocs.io/zh_CN/latest/index.html
[Link 3]: https://llh911001.gitbooks.io/mostly-adequate-guide-chinese/content/ch1.html
[blob]: https://blog.csdn.net/lu6545311/article/details/108409633
[colorhunt]: https://colorhunt.co/
[Echarts]: https://echarts.apache.org/zh/tutorial.html#5%20%E5%88%86%E9%92%9F%E4%B8%8A%E6%89%8B%20ECharts
[tweenmax]: https://www.tweenmax.com.cn/api/tweenmax/
[spritejs]: https://spritejs.org/#/zh-cn/index?id=%E7%AE%80%E4%BB%8B
[DataV]: http://datav.jiaminghi.com/guide/
[Umi]: https://umijs.org/zh-CN/docs
[html2canvas]: http://html2canvas.hertzen.com/documentation
[log-viewer]: https://github.com/FEMessage/log-viewer/blob/dev/README-zh.md
[Lodash]: https://lodash.com/
[postcss-px-to-viewport]: https://github.com/evrone/postcss-px-to-viewport/blob/master/README_CN.md
[PostCSS]: https://github.com/postcss/postcss
[Rxjs]: https://cn.rx.js.org/
[bluebird]: http://bluebirdjs.com/docs/getting-started.html
[imgcook]: https://www.imgcook.com/
[RGB]: https://www.sioe.cn/yingyong/yanse-rgb-16/
[photopea]: https://www.photopea.com/
[gojs]: https://gojs.net/latest/index.html
[jsplumb]: https://jsplumbtoolkit.com/
[JointJS]: https://www.jointjs.com/
[WEB]: http://www.html580.com/9888
[mxGraph]: http://jgraph.github.io/mxgraph/
[GG-Editor]: https://g6.antv.vision
[antv_x6]: https://x6.antv.vision/zh
[LogicFlow]: http://logic-flow.org/
[Link 4]: https://github.com/lgwebdream/FE-Interview/issues/16
[Link 5]: https://github.com/PanJiaChen/awesome-bookmarks#vue