嘿嘿,今天花点时间在这里记录一下常用的一些在线小工具,或者在线网站,方便以后查找!
1.在线压缩工具
顾名思义,压缩图片常用的
https://tinypng.com/
2.CSS属性兼容性查询
可以查询CSS属性在各个浏览器的兼容情况
https://caniuse.com/
3.CSS在线演示
如果想要快速查看一段CSS的演示效果,用在线工具是一个不错的选择
https://dabblet.com/
4.JS代码片段分析
可以测试一段代码不同写法谁执行速度更快,通过大量执行对比两段代码的运行速率
https://jsbench.me/
5. 代码执行过程演示
可以看到一段代码执行过程中的调用栈
http://latentflip.com/loupe
6.网站性能检测工具
输入网站检测网站性能
https://www.webpagetest.org/easy
7.谷歌开发者工具官方文档(需要VPN才能访问)
谷歌开发者工具文档对chrome浏览器调试工具的介绍和使用方式做了详细的说明,对前端开发者而言有很大的帮助,强烈推荐大家都去仔细阅读!
https://developer.chrome.com/docs/devtools/evaluate-performance/
8.Web Dev学习模块
这个网站上有很多关于前端性能优化相关知识的文章,免费供大家学习,也包括了谷歌开发者工具的使用,如果没有VPN,无法访问谷歌开发者工具官方文档,上这个网站也是很不错的选择~
https://web.dev/learn/