最近,优点闲. 压力,有点大,回顾,曾今被问,你怎么查看内存泄露,然后,一脸蒙. 工欲善其事, 必先利其器 最近在研究chrome devtools,发现,其实他很强.而且chrome6周一次的更新,devtools也在更新,越来越强大,越来越nice. 本篇,对于我是一个备忘录.也希望大家能得到帮助. 首先,chrome有插件,扩展,app三个层面的啥来着,分别可以通过下面的命令查看 chrome://apps chrome://extensions chrome://components (…
平时chrome插件用多了,发现在工作中有很多插件特别好用,让你事半功倍.于是我抽时间整理了一些非常好用的chrome插件分享给大家,其中有些插件是我已经离不开,每天都在用的.希望这篇文章能帮助你找到适合你的插件,提升工作效率. 工作类 FeHelper[强烈推荐] FeHelper是一个Web前端助手,由中国人开发,集成了非常多很实用的前端工具,比如:字符串编解码.代码美化.JSON格式化查看.二维码生成器.编码规范检测.JS正则表达式等.虽然是前端工具大合集,但是在我们做软件测试或者其他开发…
这篇博客推荐的都是谷歌chrome浏览器插件,理论上,与之相同内核的浏览器都能使用.由于是谷歌插件,所以在天朝的网络,你懂的! 红杏 专为 学者 .程序员.外贸工作者 打造的上网加速器.我们相信,上网本该如此简单!扯淡了,我相信大家都懂,因为在天朝.不多说,我相信收费的才能得到更好地服务. 有道智能翻译 浏览页面时,点击插件栏按钮, 就可以立刻体验有道网页翻译2.0.网页可以分翻译等级,难词用括号在原文中注释,可以全文翻译.某些网站因为安全原因,可能会使用不了,不过绝大部分网站是可以使用的. 颜…
整合优秀的前端实用工具.免费,可配置的强大工具集 示例 安装 github仓库: https://github.com/zxlie/FeHelper 官网地址:https://www.baidufe.com/fehelper Chrome商店:https://chrome.google.com/webstore/detail/pkgccpejnmalmdinmhkkfafefagiiiad 安装教程:https://www.baidufe.com/item/d1b710c290b38bda6b4…
一些小技巧让你的CSS技术更专业 使用:not()去除导航上不需要的边框 为body添加行高 垂直居中任何元素 逗号分离的列表 使用负nth-child选择元素 使用SVG图标 文本显示优化 在纯CSS幻灯片上使用max-height 继承box-sizing 表格单元格等宽 使用Flexbox摆脱边界Hack 使用属性选择器选择空链接 使用:not()添加/去除导航上不需要的边框 添加边框… /* 添加边框 */ .nav li { border-right: 1px solid #666;…
浏览器版本 Chrome Canary 新增一些没有经过Google工程师的测试或使用的浏览器功能版本.Chrome Dev让大多数开发人员主要使用此版本来测试对浏览器的重大版本功能版本.Chrome Beta面向大众用户的最稳定的预发行版本.Chrome 面向大众用户的最安全,最稳定版本.Chrome Enterprise 面向企业或机构的,支持组策略管理版本. PS:开发调试仍然建议使用Chrome,不建议使用Chrome Dev版. 补充:Chrome和Chromium关系. Chrome…
在 Web 开发者中,Chrome 是使用最广泛的浏览器.六周一次的发布周期和一套强大的不断扩大开发功能,使其成为了web开发者必备的工具.你可能已经熟悉了它的部分功能,如使用 console 和 debugger 在线编辑 CSS.在这篇文章中,我们将分享15个有助于改进你的开发流程的技巧. 一.快速切换文件 如果你使用过sublime text,那么你可能不习惯没有Go to anything这个功能的覆盖.你会很高兴听到chrome开发者功能也有这个功能,当DevTools被打开的时候,按…
写代码的时候你会发现这个插件是多么有用! 强烈推荐! 0×01.change 123456 cs"' cs"<q> cs)] cst<p> csw' csW' 1234567891011 文本              命令        结果 ---------------   -------    ----------- "Hello |world!"   cs"'       'Hello world!' "Hell…
yarn 是在工作中离不开的工具,但在工作中,很多人基本只会使用 yarn install,而且会手动删除 node-modules,或删除 yarn.lock 文件等不规范操作.本文将从一些基础的知识点开始介绍,循序渐进的让你对 Yarn 有一个更深入的了解,来保证规范的使用yarn,避免一些隐藏bug的产生. 本文主要介绍以下知识: 什么是registry 依赖的版本含义及写法 依赖类型及区别(devDependences,devDependences,peerDependences, op…
vue—你必须知道的   目录 更多总结 猛戳这里 属性与方法 语法 计算属性 特殊属性 vue 样式绑定 vue事件处理器 表单控件绑定 父子组件通信 过渡效果 vue经验总结 javascript 经验总结 更多总结 猛戳这里 属性与方法 不要在实例属性或者回调函数中(例如,vm.$watch('a', newVal => this.myMethod())使用箭头函数.因为箭头函数会绑定父级上下文,所以 this 不会按照预期指向 Vue 实例,然后 this.myMethod 将是未定义.…
越来越多的前端开发人员喜欢在Chrome里开发调试代码,Chrome有许多优秀的插件可以帮助前端开发人员极大的提高工作效率.尤其Chrome本身是可以登录的,登录后你所有的插件都会自动同步到每一个登录后的Chrome的,非常方便啊. Postman - REST Client Postman是Ajax开发的神器,对于Restful开发方式特别有帮助,可以用来模拟各种请求来测试API的正确性,比如用来模拟Ajax请求.它还支持认证,比如简单的用户名/密码,或者Oauth1.0.Rest Conso…
参考:http://www.cnblogs.com/sosoft/p/3490481.html 越来越多的前端开发人员喜欢在Chrome里开发调试代码,Chrome有许多优秀的插件可以帮助前端开发人员极大的提高工作效率.尤其Chrome本身是可以登录的,登录后你所有的插件都会自动同步到每一个登录后的Chrome的,非常方便啊. Postman - REST Client Postman是Ajax开发的神器,对于Restful开发方式特别有帮助,可以用来模拟各种请求来测试API的正确性,比如用来模…
Web前端开发实用的Chrome插件 越来越多的前端开发人员喜欢在Chrome里开发调试代码,Chrome有许多优秀的插件可以帮助前端开发人员极大的提高工作效率.尤其Chrome本身是可以登录的,登录后你所有的插件都会自动同步到每一个登录后的Chrome的,非常方便啊. Postman - REST Client Postman是Ajax开发的神器,对于Restful开发方式特别有帮助,可以用来模拟各种请求来测试API的正确性,比如用来模拟Ajax请求.它还支持认证,比如简单的用户名/密码,或者…
下载了很多chrome插件和应用,有些是常用的,有些偶尔用一次,有些是不止开发中用的,现做一下总结: 红色是个人认为比较好用的,排名不分先后 1.AppJump管理应用的插件  安装了许多应用之后肯定是需要工具管理的. AppJump能从工具栏下拉菜单上快速找到并启动应用程序和其他插件.AppJump的一个很酷的功能是能将应用程序和插件组织进入不同组.例如,可以轻松将个人插件同工作插件隔开,以进行更有效的时间管理. 但是管理全部插件会另开页面,这点不太方便. 2.Extensions Manag…
WEB前端助手(FeHelper)插件概述 WEB前端助手:FeHelper是一款chrome浏览器插件.包含一些前端实用的工具,如字符串编解码.代码美化.JSON格式化查看.二维码生成器.编码规范检测.栅格规范检测.网页性能检测.页面取色等web前端开发的常见功能.官方网站:https://www.baidufe.com/fehelper WEB前端助手(FeHelper)插件功能介绍 这款FeHelper插件对于web前端需要处理的网页html源码压缩,css或javascript的压缩都能…
前面的话 本文将详细介绍笔者在开发中常用的一些chrome插件 字符编码 前端开发时,经常出现乱码的情况.但是,新版本的chrome浏览器已经没有更改字符编码的设置选择,这时就要用到set character Encoding插件了 在页面空白处,点击右键,即可选择需要的编码格式 浏览代码 用Chrome插件Octotree,左侧会出现树形结构,方便浏览源代码 JSON 安装json-view可以以适合的格式来查看json文件 未安装之前,结果如下 安装之后,结果如下 OneTab 经常有开 1…
前端开发必备调试工具(Chrome的F12自带的功能和firebug插件差不多) 一.总结 Chrome的F12自带的功能和firebug插件差不多 二.前端开发必备调试工具 在前端开发中我们经常会要调试页面,主要html.css调试和js调试,这里整理一些工具: 三.firefox网页调试插件 1.firefox插件Firebug 主要用于html.css的调试和js调试:推荐指数: 从事了数年的Web开发工作,越来越觉得现在对WEB开发有了更高的要求.要写出漂亮的HTML代码:要编写精致的C…
越来越多的前端开发人员喜欢在Chrome里开发调试代码,Chrome有许多优秀的插件可以帮助前端开发人员极大的提高工作效率.尤其Chrome本身是可以登录的,登录后你所有的插件都会自动同步到每一个登录后的Chrome的,非常方便啊. Postman - REST Client Postman是Ajax开发的神器,对于Restful开发方式特别有帮助,可以用来模拟各种请求来测试API的正确性,比如用来模拟Ajax请求.它还支持认证,比如简单的用户名/密码,或者Oauth1.0.Rest Conso…
Google Chrome是最好用的几个浏览器之一,今天我来分享下自己收集的一系列Chrome插件,希望对大家的学习和工作有帮助. 注:你可以通过复制链接或者在谷歌商店搜索相应插件的名称来获取以下插件. 1.   HTML5 Outliner:使用HTML5概述算法显示当前网站页面的轮廓大纲 以腾讯网作为演示页面 项目源代码地址:https://github.com/h5o/h5o-js chrome商店地址:https://chrome.google.com/webstore/search/h…
前端需要知道的web安全知识 标签(空格分隔): 未分类 安全 [Doc] Crypto (加密) [Doc] TLS/SSL [Doc] HTTPS [Point] XSS [Point] CSRF [Point] 中间人攻击 [Point] Sql/Nosql 注入攻击 Crypto Node.js 的 crypto 模块封装了诸多的加密功能, 包括 OpenSSL 的哈希.HMAC.加密.解密.签名和验证函数等. 加密是如何保证用户密码的安全性? 在客户端加密, 是增加传输的过程中被第三方…
基于REST的Web服务客户端是一款功能强大的谷歌浏览器插件,使用基于REST的Web服务客户端(模拟REST客户端)可以让用户使用谷歌浏览器模拟REST请求来测试REST风格. 基于REST的Web服务客户端的开发背景 REST风格的web架构系统,又称为RESTful架构,它是一种网络数据编程的规范,REST没有具体的标准,它只是一种编程风格或者是一种约束,主要用于网络客户端与服务端的数据交互,比如手机app与云服务器之间的交互,游戏客户端与游戏服务器的交互.REST的一大特点就是表现在其是…
写在前面 我花了将近一个多月的时间断断续续写下这篇博文,并精心写下完整demo,写博客的辛苦大家懂的,所以转载务必保留出处.本文所有涉及到的大部分代码均在这个demo里面:https://github.com/liuxianan/chrome-plugin-demo ,大家可以直接下载下来运行. 另外,本文图片较多,且图片服务器带宽有限,右下角的目录滚动监听必须等到图片全部加载完毕之后才会触发,所以请耐心等待加载完毕. 本文目录: demo部分截图: 前言 什么是Chrome插件 严格来讲,我们…
写在前面 我花了将近一个多月的时间断断续续写下这篇博文,并精心写下完整demo,写博客的辛苦大家懂的,所以转载务必保留出处.本文所有涉及到的大部分代码均在这个demo里面:https://github.com/sxei/chrome-plugin-demo ,大家可以直接下载下来运行. 另外,本文图片较多,且图片服务器带宽有限,右下角的目录滚动监听必须等到图片全部加载完毕之后才会触发,所以请耐心等待加载完毕. 本文目录: demo部分截图: 前言 什么是Chrome插件 严格来讲,我们正在说的东…
[干货]Chrome插件(扩展)开发全攻略   写在前面 我花了将近一个多月的时间断断续续写下这篇博文,并精心写下完整demo,写博客的辛苦大家懂的,所以转载务必保留出处.本文所有涉及到的大部分代码均在这个demo里面:https://github.com/liuxianan/chrome-plugin-demo ,大家可以直接下载下来运行. 另外,本文图片较多,且图片服务器带宽有限,右下角的目录滚动监听必须等到图片全部加载完毕之后才会触发,所以请耐心等待加载完毕. 本文目录: demo部分截图…
写在前面 我花了将近一个多月的时间断断续续写下这篇博文,并精心写下完整demo,写博客的辛苦大家懂的,所以转载务必保留出处.本文所有涉及到的大部分代码均在这个demo里面:https://github.com/sxei/chrome-plugin-demo ,大家可以直接下载下来运行. 另外,本文图片较多,且图片服务器带宽有限,右下角的目录滚动监听必须等到图片全部加载完毕之后才会触发,所以请耐心等待加载完毕. 本文目录: demo部分截图: 前言 2.1. 什么是Chrome插件 严格来讲,我们…
本文将从个人经验出发,讲述为什么需要Chrome插件,如何开发,如何调试,到哪里找资料,会遇到怎样的问题以及如何解决等,同时给出一个个人认为的比较典型的例子——获取网页内容,和服务器交互,再把信息反馈给用户.OK,准备开始吧,我尽量把文章写得好看点,以免读者打瞌睡. 目录 为什么需要 为什么是Chrome 需要准备什么 如何开始 Page Action Chrome插件结构 学习资料 我的例子 调试 调试Content Scripts 调试Background 调试Popup 一些问题 总结 为…
本文内容都来源于偶整理的fetool. 想让更多使用Chrome的小伙伴,体验到这些令人愉悦的小工具,所以单独整理了这篇文章. 如果你是 前端/服务端/设计/面向Github编程/视觉控,相信下列的插件有不少你会用到,期待你能喜欢:) Chrome 应用商店必定是需要FQ的哈. 以下插件都是俺多年积累淘出来的,数量不多,所以就不区分 Github 插件和非 Github 插件了.按照俺推荐的强度自上向下展示,且大多数插件就是偶工作和生活必备,希望能对大家有用.后续如有新发现好插件,偶也会及时更新…
网页设计师努力寻找新的方式来展现内容.其中一个大的趋势是单页网站,现在被世界上的一些大的品牌广泛采用,使用它们来为用户提供一个快速,干净和简单的而且​​美丽的网站. 下面是10个令人惊叹的单页 H​​TML5 的网站,涵盖了简约设计,简单导航和视差滚动的综合应用. 您可能感兴趣的相关文章 经典网页设计:超炫动画效果单页网站 30个独具匠心的精美单页网站设计案例 25个以全屏照片为背景的精美网页作品 20个与众不同的网页联系表单设计案例 20个模糊背景在网站中的经典应用案例 Every Last…
chrome插件编写基本入门  http://igeekbar.com/igeekbar/post/331.htm #精选JAVASCRIPTCHROME 作为一名程序猿,怎么能不会写chrome插件呢[笑] 所以今天就教教大家怎么写最基本的chrome插件,不对,确切地说是互相学习一起学习. (我是不会告诉你说我也是刚学会没多久的!) 基础知识: 首先,我们要知道一个 chrome插件需要哪些文件 其实很简单 配置(入口)文件 manifest.json xx.html xx.css xx.j…
高效开发之SASS篇   作为通往前端大神之路的普通的一只学鸟,最近接触了一样稍微高逼格一点的神器,特与大家分享~ 他是谁? 作为前端开发人员,你肯定对css很熟悉,但是你知道css可以自定义吗?大家都知道,js中可以自定义变量,css仅仅是一个标记语言,不是编程语言,因此不可以自定义变量,也不可以引用等等.作为一名程序员,不能编程怎么能忍受,这就是sass存在的意义,工业化生产,让CSS程序范儿. 主要目的就是让你写CSS时不在重复. SASS优点可以简单的规纳为以下几点: 增加了一些编程特性…