首页 文章资讯 前端开发者爱不释手的Chrome扩展(一)

前端开发者爱不释手的Chrome扩展(一)

发布者 : okay

1453

2018-08-29

1535522098875063.png  Prism Pretty


Prism Pretty能够格式化/高亮/预览 HTML / JS / CSS / Markdown代码的Chrome扩展程序。


1535522333750946.jpg


精确检测,操作简单易上手,三种主题可供选择。


1535522693288435.png


显示简短的请求头字段,将unicode转换为文本,支持自定义CSS设置和属性预览,以及Markdown文件预览。


1535522842801996.jpg


1535523227611996.png fetools


前端设计必备的网站导航fetools,按照网站首字母进行排序,前端人员常用的资源网站都可一键直达。


1535523342623910.jpg


每个网站都有灰色标识标明类别,支持搜索查找,已滤除百度广告,搜索结果界面简单清爽。


1535523444974066.jpg 1535523446712586.jpg


1535523746376834.png React Developer Tools


简单来说,这是一款由Facebook提供的ReactJs开发者工具。


React Developer Tools是一个用于开源React JavaScript库的Chrome DevTools扩展,允许用户检查Chrome开发人员工具中的React组件层次结构。


1535523849254244.jpg


当你使用React时,网站上的扩展图标会亮起,开发者工具中会增加一个名为React标签。


1535523954401786.png


通过选择树视图的一个组件,你可以在右侧的面板中对它进行检查和编辑。


在“面包屑”中,你可以检查所选组件,创建它的组件,创建该组件的组件,等等。


1535524085633232.gif


使用搜索栏按名称查找组件:


1535524248729982.gif


1535524413787188.png PageSpeed Insights


PageSpeed Insights是一个页面优化检测工具,用于分析网页效果,并获得有关如何优化它们的具体建议。


1535525372451087.jpg


分析示例:


1535524896327193.jpg

分享

全部评论

    展开更多评论

    扩展迷QQ交流群

    错误提示保存失败
    成功提示保存成功
    close
    qr-code

    为打击盗链困扰,本站已启用公众号验证
    微信扫码关注上方公众号,回复“插件”二字获得验证码,验证码5分钟内全站有效。

    正在验证
    验证成功
    下载遇到问题?请添加QQ群:398095333
    close
    qr-code

    为打击盗链困扰,本站已启用公众号验证
    微信扫码关注上方公众号,回复“脚本”二字获得验证码,验证码5分钟内全站有效。

    正在验证
    验证成功