前端常用资源

2023-04-03  本文已影响0人  M_Black

1.数字格式化

GitHub - adamwdraper/Numeral-js: A javascript library for formatting and manipulating numbers.

Numeral.js (numeraljs.com)

numeral - npm (npmjs.com)

2.比UUID更轻量的唯一ID生成器,UUID和NanoID的区别

NanoID 大小只有 108 字节 与 UUID 不同,NanoID 的大小要小 4.5 倍,并且没有任何依赖关系。

此外,大小限制已将大小从另外 35% 减小。大小减少直接影响数据的大小。

例如,使用 NanoID 的对象小而紧凑,用于数据传输和存储。更安全 在大多数的随机生成器中,他们使用不安全的Math.random()。但是,NanoID使用crypto module和Web Crypto API,这是更安全的。

另外,NanoID在实现ID生成器的过程中使用了它自己的算法,称为统一算法,而不是使用"随机%的字母表"。

统一算法:https://github.com/ai/nanoid/blob/main/index.js

nanoid - npm (npmjs.com)

uuid - npm (npmjs.com)

NanoID 比 UUID 更年轻,且从npm趋势对比来看,NanoID的上升趋势更明显,而UUID的进展则很平缓。

因此,基于NanoID 更小、更快、更安全、更不易冲突,个人更推荐使用 NanoID。

3.Licia 是一套在开发中实践积累起来的实用 JavaScript 工具库。该库目前拥有超过 400 个模块。

优势

a.同时支持浏览器、node 及小程序运行环境 在开发中,我们发现相当一部分 npm 包是无法直接在小程序中跑起来的。比如前端工程师十分常用的 lodash,在小程序中引入会报错。要进行一定的修改才能正常跑在小程序中。

b.比lodash和underscore增加更多的适用函数,400+ 的模块。md5、atob、btoa、Emitter、dateFormat等方法精炼简单。

c.定制化生成可以使用更小体积的工具库,只需要工程中需要的函数,其他通通砍掉!

licia - npm (npmjs.com)

官方地址: https://licia.liriliri.io/

生成定制化 util.js

使用 npm 包的方式会将所有功能引入到代码包中,大概会增加 100 kb 的大小。如果你只想引入所需脚本,可以使用在线工具生成定制化 util 库。

a、访问 https://licia.liriliri.io/builder.html

b、输入需要的模块名,点击生成下载 util.js。

c、将生成的工具库拷贝到小程序项目任意目录下然后直接引入使用。

4.TypeIt是一个通用的JavaScript打字机效果实现程序。

凭借其简单而灵活的配置,您可以键入单个或多个字符串,这些字符串可以中断行,删除/替换彼此,轻松处理包含HTML的字符串,循环等等。

而且为了获得更高级、更可控的打字效果,TypeIt附带了一些配套功能,这些功能可以链接起来将您的打字控制在单个字符或毫秒,使您能够键入动态叙述,完全控制速度变化、换行、删除和暂停。

特点

为提供了一系列流畅的API,以便微调效果。

选择仅当目标元素在屏幕上可见时才开始键入。

连续循环字符串。

以编程方式或直接在HTML中定义字符串

轻松处理HTML(甚至是嵌套标签!),保留其所有属性(类,id等)SEO友好。

作为现代捆绑商的 ES 模块提供,或作为 UMD 库提供,用于通过传统标签加载。<script>

typeit - npm (npmjs.com)

5.howler.js是现代网络的音频库。它默认为Web Audio API并回退到HTML5 Audio。这使得在所有平台上使用 JavaScript 处理音频变得容易且可靠。

howler.js不仅有诸多特点,而且还兼容了许多旧版本

满足所有音频需求的单一 API

默认为 Web 音频 API 并回退到 HTML5 音频

跨环境处理边缘情况和错误

支持所有编解码器以提供完整的跨浏览器支持

自动缓存以提高性能

单独、分组或全局控制声音

一次播放多个声音

简单的声音精灵定义和播放

完全控制衰落、速率、搜索、音量等。

轻松添加 3D 空间声音或立体声声像

模块化 - 使用您想要的并且易于扩展

没有外部依赖,只有纯 JavaScript

轻至 7kb 压缩包

howler - npm (npmjs.com)

6.timeago.js 是一个非常简洁、轻量级、不到 2kb 的很简洁的 Javascript 库。作用就是将 datetime 时间转化成类似于*** 时间前的描述字符串,例如:“3小时前”。

特点

本地化支持,默认自带中文和英文语言;  

之前 xxx 时间前、xxx 时间后;

支持自动实时更新;

支持npm方式和浏览器script方式;

测试用例完善,执行良好。

timeago.js - npm (npmjs.com)

7.按钮生成器

https://markodenic.com/tools/buttons-generator/

上一篇 下一篇

猜你喜欢

热点阅读