- 综合排序
- 最热优先
- 最新优先
- 来自专栏前端修炼之路
【第3期】前端常用插件、工具类库汇总
本篇文章整理自己使用过的和看到过的一些插件和工具，方便日后自己查找和使用。 另外，感谢白小明，文中很多的工具来源于此。 vConsole：https://github.com/Tencent/vConsole 同样是由腾讯开发维护的代码调试工具，是针对移动端的调试工具。 outils：https://github.com/proYang/outils 前端业务代码工具库。统一封装常用函数，并发布到npm，以提高开发效率。 Magic.css：https://github.com/miniMAC/magic css3 animation动画库。 数据Mock Mock.js：http://mockjs.com/ 是一款前端开发中拦截Ajax请求再生成随机数据响应的工具.可以用来模拟服务器响应.
5.3K10发布于 2020-03-24 - 来自专栏全栈程序员必看
数据可视化工具d3_前端3d可视化
可视化工具D3教程 第1章 D3简介 第2章 第一个程序 Hello World 第3章 正式进入D3的世界 第4章 选择、插入、删除元素 第5章 做一个简单的图表 第6章 比例尺的使用 第7章 坐标轴 D3 正是数据可视化工具中的佼佼者，基于 JavaScript 开发，项目托管于 GitHub。从 D3诞生以来，不断受到好评，在 GitHub 上的项目仓库排行榜也不断上升。 各种数据可视化工具也如井喷式地发展，D3 正是其中的佼佼者。D3 的全称是（Data-Driven Documents），顾名思义可以知道是一个被数据驱动的文档。 布局是 D3 中一个十分重要的概念。D3 与其它很多可视化工具不同，相对来说较底层，对初学者来说不太方便，但是一旦掌握了，就比其他工具更加得心应手。 下图展示了 D3 与其它可视化工具的区别： 如何理解布局 从上面的图可以看到，布局的作用是：将不适合用于绘图的数据转换成了适合用于绘图的数据。
14.2K40编辑于 2022-11-10 - 来自专栏python3
前端资源(3)
入门类 地址 前端入门教程 http://www.cnblogs.com/jikey/p/3613082.html 瘳雪峰的Javascript教程 www.liaoxuefeng.com/wiki/001434446689867b27157e896e74d51a89c25cc8b43bdb3000 jQuery基础教程 http://www.imooc.com/view/11 前端工程师必备的 PS技能——切图篇 http://www.imooc.com/view/506 结合个人经历总结的前端入门方法 https://github.com/qiu-deqing/FE-learning 工具类 地址 前端人的俱乐部 http://f2er.club/ 真可以解放你的收藏夹 如何优雅地使用Sublime Text http://www.jeffjade.com/2015/12/15/2015 雪碧图制作 http://www.imooc.com/learn/93 版本控制入门 – 搬进 Github http://www.imooc.com/learn/390 Grunt-beginner前端自动化工具
43730发布于 2020-01-10 - 来自专栏7DGroup
性能工具之前端工具梳理
经常被问到为什么前端不写性能分析相关的内容。我觉得有几个原因。 觉得写不专业；2. 不怎么感兴趣。 这个文章也只是梳理下有哪些工具可以用，并没有做深入的分析。 有的人可能看到页面是一次展示出来的，那就是前端设计的太差了。 另外，不同的浏览器用的内核不一样，所以展示的过程会有细微的差别。 还是回到工具上。 charlesproxy ? 这个瀑布视图是我觉得前端性能分析工具中做的最好看的。 各元素的响应时间一目了然。并且也把时间细分的非常好。 但可惜的是它只能支持windows，ipad，iphone。 不知道这个工具开发者是怎么想的。 并且这个工具的专业版也收费。 safari开发者工具 ? 如果是喜欢简洁的人，这个工具必然是首选。 以上的工具中，都有对前端做调试的功能，下个断点，改个页面参数，复制请求，重发请求，自组装请求之类的。 总之，对于前端的性能分析来说，工具真的已经做的非常完整清晰了。要是说分析时间消耗，看这些就够了。
1.6K20发布于 2019-07-17 - 来自专栏前端笔记薄
前端杂记-画图工具
画图工具 figma，我和同事在用的画图工具，色彩丰富，组件丰富，简单熟悉以后很好使。 processon，专业强大的作图工具，支持多人实时在线协作，可用于原型图、UML、BPMN、网络拓扑图等多种图形绘制。
96620编辑于 2022-12-27 - 来自专栏玩转全栈
前端工具分类简介
，javascript模块打包方案(方案+工具+插件)， - babel, TypeScript, 算是一类，ES编译器， - requirejs , seajs 是一类, 以前基于 commonjs， amd，cmd，umd 之类的模块类包加载方案的框架， - grunt , gulp , 前端工具，结合插件，合并、压缩、编译 sass/less，browser 自动载入资源， - react , angular , vue , backbone 是一类，mvc , mvvm , mvp 之类的前端框架， - jquery , zepto , prototype 是一类，前端 DOM , BOM 类库 ， - - Ionic , NativeScript , React Native , Flutter , PhoneGap/Cordova , Xamarin 算是一类，Cross-Platform 开发工具 前端玩移动端 --weex 阿里的，目前来说还行吧。 --React Native ，Facebook的，写起来也凑合。
1.2K61发布于 2019-04-16 - 来自专栏JAVA相关
前端工具方法整理
7.解析数组内容用逗号拼接我有个"0", "1", "2", "3", "4"，我想输出："0,1,2,3,4"const warningNotice = ["0", "1", "2", "3", "4 方法：event.preventDefault()本人其他相关文章链接1.Vue3快速上手简介2.vue3第一章基础：创建Vue3.0工程，包括使用vue-cli 创建、使用 vite 创建3. ：ref函数6.vue3知识点：reactive函数7.vue3知识点：Vue3.0中的响应式原理和 vue2.x的响应式8.vue3知识点：reactive对比ref9.vue3知识点：计算属性与监视属性 10.vue3知识点：生命周期11.vue3知识点：自定义hook函数12.vue3知识点：toRef函数和toRefs函数13. 《vue3第六章》其他，包含：全局API的转移、其他改变23.vue3知识点：Teleport组件24.vue3知识点：Suspense组件25.vue3使用音频audio标签26.vue3 脚手架初始化项目生成文件的介绍
27700编辑于 2025-05-28 - 来自专栏PY的开发实践
前端应用部署工具
接触过很多部署网站的工具，总体来说分为静态网站托管和 serverless。 基本流程部署工具基本包含以下三大块：触发器、CI、CD触发器触发器指的是触发部署动作，分为两大类：cli: 腾讯云 TCD, vercel-cli 这类工具实现本地命令行登陆账号，通过本地命令行出发构建部署 静态网站部署vercelvercel 是一个前端明星团队。 按流程来一遍即可，非常简单githubPagesgithubPages 是 github 用来部署项目主页的工具，结合 workflow, 利用 gh-pages 这个 action， 部署起来非常快。 总结当前处于云原生时代，对前端开发人员也越来越友好，各种部署工具层出不穷，我们只需要专注于自己的核心能力即可，能够被标准化的产业肯定会被标准化的，云函数也好，云托管也好，本质上就是让开发者能够更快更简单的去上线自己的创意
7K41编辑于 2022-07-12 - 来自专栏森屿暖树
前端特效学习3
> </body> </html> css代码 :root { /** 白天样式 **/ --blue-background: #C2E9F6; --blue-border: #72cce3;
41720编辑于 2022-03-23 - 来自专栏全栈者
前端开发工具总结
主要是为了帮助大家搜集一下前端开发中要用到的一些东西，打造一个前端开发工具字典，方便大家查阅。 篇幅比较长，先给大家放一张脑图，看看自己的兴趣在哪，或者说自己需要补充哪方面的，可以从右边的导航栏查看，也可以直接打开我做的工具网站查看，分级明显。前端工具集~ ? W3Cplus - 大漠(《图解 CSS3》作者)在国内的影响力杠杠的 淘宝前端团队 - 内容涵盖 Web 和 Node，要深度有深度，要广度有广度 奇舞团博客 - 坚持是最宝贵的，别人的奇舞周刊早已经过百期了 前端开发博客 - 汇集了很多前端有用的东西 搭建博客的工具 VuePress - 能帮助你快速搭建自己的博客，样式还不算很那看，但是更多的可以用作搭建文档。 ，为了 css 兼容，可以使用这个，css，less，scss 都可以用 压缩 js，css，html base64 加密解密 css3 中的阴影生成工具 - 可以让 UI 根据这个去写阴影
3.2K21发布于 2019-08-30 - 来自专栏腾讯技术工程官方号的专栏
前端性能分析工具利器
分析的方向除了业务本身的特点相关之外，常见的还可以借助一些工具来发现问题。 本文主要介绍前端性能分析可以怎么走~ 前端性能分析工具（Chrome DevTools） 一般来说，前端的性能分析通常可以从时间和空间两个角度来进行： 时间：常见耗时，如页面加载耗时、渲染耗时、网络耗时 由于我们的网页基本上跑在浏览器中，所以基本上大多数的工具都来源于浏览器自身提供，首选工具自然是 Chrome DevTools。本文我们也主要围绕 Chrome DevTools 来进行说明。 我们提及前端监控的时候，大多数都包括了真实用户监控。 我们能看到生成的 JSON 文件长这样： 这样的 JSON 文件，我们可以丢到 DevTools Timeline Viewer 中，可以看到对应的时间轴和火焰图： 3. Runtime。
3.5K62发布于 2020-09-03 - 来自专栏阿杜的世界
前端开发：工具和流程
在谷歌上浏览资料过程中，偶然遇到ThoughtWorks的这篇文章：我们真的缺前端工程师么？ 文章的核心观点在于：我们不是缺前端工程师，我们是缺优秀的前端工程师。 我再激进一点，我的观点是：我们不是缺前端工程师，我们是缺优秀的具备匠心的工程师。 我在阅读上文的时候，文中提到《3周3页面》这本电子书，于是我在selfstore上买来看了，本文的内容算是我的读书笔记。我们今天的主题是：当下前端开发的工具以及开发流程。 开发工具 1. 3. Guard + LiveReload Guard是一个命令行工具，可以检测到本地文件的修改，并且可以触发一些命令。 参考资料 3周3页面 HTML & CSS 设计与构建网站 设计中的设计 原研哉
75320发布于 2018-08-06 - 来自专栏前端技术开发
Parcel前端构建工具
Parcel 是 Web 应用打包工具，适用于经验不同的开发者。它利用多核处理提供了极快的速度。 https://parceljs.org/getting_started.html 配置了一个简易的web打包工具 https://github.com/MrZHLF/Parcel ? 脚本配置好之后，直接启动dev启动项目，build对项目的打包工具 npm run dev ? postcss-px-to-viewport')({ viewportWidth: 750, viewportHeight: 1334, unitPrecision: 3, "regenerator": true, "useESModules": false } ] ] } 这个打包工具适合一些简易的
1.3K40发布于 2019-12-25 - 来自专栏李维亮的博客
前端自动刷新工具
省时的浏览器同步测试工具 Browsersync能让浏览器实时、快速响应您的文件更改（html、js、css、sass、less等）并自动刷新页面。 打开一个终端窗口，运行以下命令： npm install -g browser-sync 当然您也可以结合gulpjs或gruntjs构建工具来使用，在您需要构建的项目里运行下面的命令: npm install --save-dev browser-sync 3. 那么您只需要运行命令行工具，进入到该项目（目录）下，并运行相应的命令： 静态网站 // --files 路径是相对于运行该命令的项目（目录），以css为例： browser-sync start --server
1.4K30发布于 2021-07-09 - 来自专栏AllTests软件测试
前端性能分析工具-Lighthouse
前端性能分析工具-Lighthouse 目录 1、前言 2、简介 3、使用 1、前言 对于前端开发人员来说，除了实现页面功能外，那就是页面的性能响应问题也要关注。 同样对于测试人员在进行性能测试时，也要关注前端页面的性能指标。 测试前端性能市面上可以用到的工具也比较多，比如可以用 HttpWatch 进行页面的抓取与分析，或者也可以使用抓包工具如 Fiddler 抓接口的形式进行分析。 本篇将介绍一款前端性能分析工具，即集成在 Chrome 开发者工具-Lighthouse。 2、简介 Lighthouse 用于分析 Web 应用程序和网页，收集性能指标和对开发人员最佳实践的见解。 架构图： github地址： https://github.com/GoogleChrome/lighthouse 3、使用 前提：需要安装 Chrome 浏览器。
1.6K20编辑于 2022-07-26 - 来自专栏深入浅出区块链技术
Dapp 前端工具: Drizzle Store
译文出自：登链翻译计划[1] 译者：翻译小组[2] 校对：Tiny 熊[3] 如果你最近一直在尝试用 React 和 Redux 构建 dapp 前端，估计你已经意识到不能只专注于 dapp 做什么，为了使用 我们来看看它是怎么工作的，怎么用它来构建 dapp 前端。 什么是 drizzle store？它是怎么工作的？ web3 ：包含 web3 实例状态的对象。 url } }, web3 实例化可以用下面的图描述： Web3实例化 调用和交易 调用： 当你想要从以太坊区块链读取数据时，你可以使用 web3 合约的call或者用 drizzle drizzle 实例，它将为我们提供 web3 和合约实例。
1.7K20编辑于 2022-02-22 - 来自专栏追不上乌龟的兔子
新兴前端开发工具
我在最近的前端项目中用到了 vite 与 swc 作为构建工具和 JavaScript 编译器，二者都比较年轻，但提供更优秀的前端开发体验。 当下前端生态的新选手层出不穷，本文就简单介绍一下最近几年前端生态涌现的诸多新兴的技术与工具。 vite vite是一个新兴的前端构建工具，在开发时使用 HMR 技术实现秒级的热更新，编译时使用 esbuild 和 Rollup 进行编译与打包，速度非常快。 vite 也是 vue3 的官方构建工具。 前端框架（React.js 生态） next.js next.js是一个 React 框架，提供了 SSR、SSG、CSR 等多种渲染模式，同时提供了很多优秀的功能，比如图片优化、代码分割、预取、预加载
74220编辑于 2023-07-09 - 来自专栏达达前端
前端技术工具类文章
[使用wavesurfer.js绘制音频波形图] wavesurfer.js是一个可自定义的语音音频可视化工具，建立于web audio和H5 canvas之上 将wavesurfer.js的包引用到项目中 $emit("aaa") 复制代码 3.监听事件 复制//home.vue this.$bus.$on("aaa",()=>{ this. forEach() 本身是不支持的 continue 与 break 语句的 使用 return 语句实现 continue 关键字的效果： continue 实现 实例 var arr = [1, 2, 3, 4, 5];\ \ arr.forEach(function (item) {\ if (item === 3) {\ return;\ }\ console.log 例如，“o{1,3}”将匹配“fooooood”中的前三个o。“o{0,1}”等价于“o?”。请注意在逗号和两个数之间不能有空格。 ? 当该字符紧跟在任何一个其他限制符（*,+,?
1.6K30发布于 2021-11-02 - 来自专栏游戏杂谈
前端开发--优化工具
p=478 一般来讲优化前端，涉及到文件优化的有合并、压缩JS和CSS，以及对图片的优化处理，这篇文章的工具很不错，强烈推荐一下。 整理一下我现在用的命令行工具。各有优缺点，混搭着用。 github.com/nzakas/datauri/downloads/ 快速上手： java -jar datauri-x.y.z.jar -o output.txt image.png 检查工具 其实这不算命令行工具，这工具还是有点用的 Rhino + JSLint Javascript/html代码品质检查工具。
79430发布于 2018-11-15 - 来自专栏性能与架构
前端构建工具grunt
grunt是什么 grunt是目前非常流行的前端构建工具，支持自定义插件，有丰富的插件帮助我们完成构建任务 自动化完成我们指定的任务，例如压缩、编译、单元测试、linting等 前端为什么需要构建工具 先看下前端的开发场景 小项目中，css文件和js文件并不多，前端部分是很轻的，几乎不需要我们特别的关注 而在一个大项目中，css文件和js文件的数量会达到几十个上百个，一个页面中会引用很多css和js 的开发越来越复杂，那么我们就需要生成文档，来描述各个模块和方法 这时我们就会发现，开发之外的工作繁琐了很多，不仅需要写好代码，还需要做好 合并压缩、单元测试 等一系列的工作，我们就会渴望有一个便利的构建工具来完成这些工作 grunt能做什么 我们在grunt中定义好各个任务，让grunt来自动完成这些任务 例如： （1）合并压缩，把多个js或css文件合并、压缩 （2）对js进行语法检查 （3）js单元测试 （4）
1.3K50发布于 2018-04-02
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号