Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.
Awesome Lists | Featured Topics | Projects
https://github.com/ly2513/awesome-frontend

策划的非常棒前端列表库、资源和闪亮的东西。
https://github.com/ly2513/awesome-frontend
List: awesome-frontend
Last synced: about 1 month ago
JSON representation
策划的非常棒前端列表库、资源和闪亮的东西。
Host: GitHub
URL: https://github.com/ly2513/awesome-frontend
Owner: ly2513
Created: 2016-04-27T09:24:06.000Z (over 8 years ago)
Default Branch: master
Last Pushed: 2016-04-27T09:26:43.000Z (over 8 years ago)
Last Synced: 2024-05-22T15:05:34.182Z (4 months ago)
Size: 15.6 KB
Stars: 82
Watchers: 3
Forks: 7
Open Issues: 0
Metadata Files:
- Readme: README.md
Awesome Lists containing this project

ultimate-awesome - awesome-frontend - 策划的非常棒前端列表库、资源和闪亮的东西。. (Other Lists / PowerShell Lists)
README

        ---

title: 前端组件库

date: 2016-04-27 16:39:21

category:

tags: [js,前端]

---

搭建web app常用的样式/组件等收集列表(移动优先)

---

- 一个常用的PHP类库, 资源以及技巧列表 [awesome-php](https://github.com/JingwenTian/awesome-php/) 推荐

---

## 0. 前端自动化(Workflow)

- 前端构建工具

  - [Webpack - module bundler](https://github.com/webpack/webpack)

  - [Yeoman - a set of tools for automating development workflow](https://github.com/yeoman/yeoman) 

  - [gulp - The streaming build system](http://gulpjs.com/) 

  - [grunt - the JavaScript Task Runner](http://gruntjs.com/)

  - [F.I.S - 前端集成解决方案](https://github.com/fex-team/fis)

- 前端模块管理器

  - [Bower - A package manager for the web](http://bower.io/)

  - [Browserify](http://browserify.org/)

  - [Component](https://github.com/componentjs/component)

  - [Duo](http://duojs.org/)

  - [RequireJS](http://requirejs.org/)

  - [Sea.js](http://seajs.org/)

  - [LABjs - 文件加载器](https://github.com/getify/LABjs)

  - [css-modulesify - CSS模块加载器](https://github.com/css-modules/css-modulesify)

- css预处理器

  - [Less - Less is More , Than CSS](http://lesscss.org/) 

  - [Sass - Syntactically Awesome Style Sheets](http://sass-lang.com/)

  - [Stylus - Expressive, dynamic, robust CSS](http://learnboost.github.io/stylus/)

- 前端性能分析工具

  - [analyze-css - CSS 选择器的复杂度和性能分析器](https://github.com/macbre/analyze-css)

## 1. 前端框架(Frameworks)

- [Bootstrap](https://github.com/twbs/bootstrap)

- [Foundation](https://github.com/zurb/foundation)

- [Amaze UI](http://amazeui.org/)

- [Semantic UI](https://github.com/semantic-org/semantic-ui)

- [Pure CSS](http://purecss.io/)

- [topcoat](https://github.com/topcoat/topcoat)

- [UIkit](https://github.com/uikit/uikit)

- [Material UI](https://github.com/callemall/material-ui)

- [Materialize - 一个基于 Material Design 的 CSS 框架](https://github.com/Dogfalo/materialize)

- [Framework7](http://www.idangero.us/framework7)

- [mui](https://github.com/dcloudio/mui)

- [ionic framework](http://ionicframework.com/)

- [Fries](https://github.com/jaunesarmiento/fries)

- [jQuery Mobile](http://jquerymobile.com/)

- [App.js](https://github.com/kikinteractive/app)

- [Office UI Fabric - 微软 Office 前端团队的框架](https://github.com/OfficeDev/Office-UI-Fabric)

## 2. JavaScript 框架汇总

- JavaScript 框架

  - [react](https://github.com/facebook/react)

  - [Angular](https://github.com/angular/angular)

  - [jQuery](https://github.com/jquery/jquery)

  - [Backbone.js](https://github.com/jashkenas/backbone)

  - [ember.js](https://github.com/emberjs/ember.js)

  - [Ractive.js](https://github.com/ractivejs/ractive)

  - [KISSY](https://github.com/kissyteam/kissy)

  - [Zepto.js](https://github.com/madrobby/zepto)

  - [Vanilla JS](http://vanilla-js.com/)

  - [Vue.js - 数据驱动的组件化MVVM库(用于创建web交互界面和数据双向绑定)](https://github.com/yyx990803/vue)

  - [Can.js](http://canjs.com/guides/Utilities.html)

  - [Avalon](https://github.com/RubyLouvre/avalon)

  - [T3 JavaScript Framework - 一个用于搭建大型Web应用的客户端JS框架](https://github.com/box/t3js/)

  - [jsblocks - Better MV-ish Framework 从简单 UI 到复杂单页应用都适用](https://github.com/astoilkov/jsblocks)

- 轻量级JavaScript框架

  - [Min.js - Super minimal selector and event library](https://github.com/remy/min.js) 

  - [skel.js - A lightweight responsive framework](https://github.com/n33/skel)

  - [Sprint.js - 一个高性能、小体积的 DOM 操作库](https://github.com/bendc/sprint)

  - [knockout](https://github.com/knockout/knockout)

  - [PhantomJS - 一个基于 WebKit 的服务器端 JavaScript API](https://github.com/ariya/phantomjs/)

- 函数式反应型编程框架 FRP (Functional Reactive Programming) library

  - [Bacon.js - A small functional reactive programming lib for JavaScript.](https://github.com/baconjs/bacon.js/) 

  - [Flapjax - 一个支持FRP的JavaScript框架](http://www.flapjax-lang.org/)

- JavaScript 工具库

  - [underscore.js](https://github.com/jashkenas/underscore)

  - [Underscore.string.js字符串操作库](https://github.com/epeli/underscore.string)

  - [functional.js](https://github.com/leecrossley/functional-js/)

  - [Lo-Dash - A JavaScript utility library](https://github.com/lodash/lodash)

  - [Lazy.js - a functional utility library for JavaScript](https://github.com/dtao/lazy.js)

  - [Fn.js](https://github.com/eliperelman/fn.js)

  - [Way.js - 双向数据绑定库](https://github.com/gwendall/way.js)

  - [boiler - a utility library that makes tasks in JavaScript easier](https://github.com/Xaxis/boiler)

  - 快捷键操作

    - [Keys.js - 应用快捷键](https://github.com/bitwalker/keys.js)

    - [simple-hotkeys](https://github.com/mycolorway/simple-hotkeys)

    - [jquery.hotkeys](https://github.com/jeresig/jquery.hotkeys)

    - [Mousetrap - 键盘快捷键操作](https://github.com/ccampbell/mousetrap)

## 3. 前端游戏框架

- [cocos2d-html5](https://github.com/cocos2d/cocos2d-html5)

- [Egret Engine](http://www.egret-labs.org/)

- [LimeJS](https://github.com/digitalfruit/limejs)

- [EaselJS](https://github.com/CreateJS/EaselJS)

- [three.js](https://github.com/mrdoob/three.js)

- [AlloyStick](https://github.com/AlloyTeam/AlloyStick)

- [The-Best-JS-Game-Framework](https://github.com/finscn/The-Best-JS-Game-Framework)

- [CanvasEngine](https://github.com/RSamaium/CanvasEngine)

- [Quintus](https://github.com/cykod/Quintus)

- [Stage.js](https://github.com/piqnt/stage.js/)

- [phaser - 一个快速、免费、开源的 HTML5 游戏框架](https://github.com/photonstorm/phaser/)

## 4. ui组件库(CSS Framework)

- [WeUI - 微信官方UI库](https://github.com/weui/weui)

- [GMU - 基于zepto的ui组件库，适用于移动端](https://github.com/fex-team/GMU)

- [FrozenUI - 腾讯移动端组件库](https://github.com/frozenui/frozenui)

- [NEC - 更好的CSS方案 ](http://nec.netease.com/)

- [NEJ - 更好的JS解决方案](http://nej.netease.com/)

- [Pure CSS Components](https://github.com/LFeh/css-components/)

- [magic-of-css](https://github.com/adamschwartz/magic-of-css)

- [Primer - The CSS toolkit and guidelines that power GitHub](https://github.com/primer/primer)

- [light7 - A Light and easy to use UI Lib](https://github.com/lihongxun945/light7)

- [Spectre.css - 轻量、响应式的现代 CSS 框架](https://github.com/picturepan2/spectre)

## 5. 基础模版

- 浏览器统一(Cross Browser)

  - [HTML5 BOILERPLATE](https://github.com/h5bp/html5-boilerplate)

  - [Modernizr](https://github.com/Modernizr/Modernizr)

  - [Normalize.css](https://github.com/necolas/normalize.css/)

  - [HTML5 Shiv - 让ie浏览器成为支持html5的浏览器的解决方法](https://github.com/afarkas/html5shiv)

  - [cssFx - 为CSS3自动生成浏览器前缀](https://github.com/imsky/cssFx)

  - [-prefix-free - Break free from CSS prefix hell](https://github.com/LeaVerou/prefixfree)

  - [ieBetter.js - make ie browser like a morden browser main for ie6~ie8](https://github.com/zhangxinxu/ieBetter.js)

  - [es6-promise - Promise 对象的兼容](https://github.com/stefanpenner/es6-promise)

- 响应式

  - [Responsive - 响应式布局](https://github.com/ResponsiveBP/Responsive)

  - [Enquire.js - Awesome Media Queries in JavaScript](https://github.com/WickyNilliams/enquire.js)

  - [Free Wall - 创建桌面，移动和平板的动态网格布局](https://github.com/kombai/freewall)

- 适配方案

  - [MetaHandler.js：移动端适配各种屏幕无痛工具脚本](https://github.com/unbug/generator-webappstarter/blob/master/app/templates/app/src/util/MetaHandler.js)

  - [lib-flexible: 移动端自适应方案](https://github.com/amfe/lib-flexible)

    - [参考: 使用Flexible实现手淘H5页面的终端适配](https://github.com/amfe/article/issues/17?hmsr=toutiao.io&utm_medium=toutiao.io&utm_source=toutiao.io)

    - [flexible demo 1](http://ufologist.github.io/responsive-page/others-responsive/flexible.html)

    - [flexible demo 2](http://huodong.m.taobao.com/act/yibo.html)

  - [pageResponse](https://github.com/peunzhang/pageResponse)

  - [responsive-page](https://github.com/ufologist/responsive-page)

## 6. 排版

- [yue.css](https://github.com/lepture/yue.css)

- [typo.css](https://github.com/sofish/typo.css)

- [chinese-copywriting-guidelines - 中文文案排版指南](https://github.com/sparanoid/chinese-copywriting-guidelines) 

## 7. 网格系统

- [grid](https://github.com/aekaplan/grid)

- [Flexbox Grid](https://github.com/kristoferjoseph/flexboxgrid)

- [MasonJS - creating a perfect grid](https://github.com/DrewDahlman/Mason)

## 8. 路由和链接(Routing And URLs)

- [History.js - gracefully supports the HTML5 History/State APIs](https://github.com/browserstate/history.js)

- [jquery-pjax - pushState+ajax](https://github.com/defunkt/jquery-pjax)

- [jquery-address - Deep Linking](https://github.com/asual/jquery-address)

- [page.js - Micro client-side router](https://github.com/visionmedia/page.js)

- [crossroads.js](https://github.com/millermedeiros/crossroads.js)

- [hash.js](https://github.com/javve/hash.js)  

- [path.js](https://github.com/mtrpcic/pathjs)

- [director.js - 前端路由库(通过#符号进行路径组织,结合vue的component可进行单页的局部模块刷新)](https://github.com/flatiron/director)

- [URI.js](https://github.com/medialize/URI.js)

- [Roadcrew.js](https://github.com/grobmeier/Roadcrew.js)

- [SpeakingURL](https://github.com/pid/speakingurl)

- [uparams - An URL params parser](https://github.com/YanagiEiichi/uparams)

## 9. UA 识别

- [detector](https://github.com/hotoo/detector)

## 10. 表单处理

### 10.1 表单验证(Form Validator)/表单提示

- [Validator](https://github.com/niceue/validator)

- [Parsley](https://github.com/guillaumepotier/Parsley.js)

- [jquery.form.js - jQuery Form Plugin](https://github.com/malsup/form)

- [Validform](https://github.com/haiercdboy/Validform)

- [validator.js](https://github.com/sofish/validator.js)

- [jquery-validation - jQuery Validation Plugin](https://github.com/jzaefferer/jquery-validation)

- [formvalidator.js](https://github.com/victorjonsson/jQuery-Form-Validator)

- [Fort.js – 表单填写进度提示](http://github.com/Colourity/Fort.js)

- [mailcheck - 用于检测email地址的域名](https://github.com/mailcheck/mailcheck)

- [Floatlable.js - 输入时显示placeholder文本](https://github.com/clubdesign/floatlabels.js)

- [jQuery Label Better](https://github.com/peachananr/label_better)

- [validator.js](https://github.com/ppoffice/validator.js)

### 10.2 < select > 相关 ###

- [Chosen](https://github.com/harvesthq/chosen)

- [Select2](https://github.com/select2/select2)

- [bootstrap-select](https://github.com/silviomoreto/bootstrap-select)

### 10.3 单选框/复选框相关 ###

- [iCheck - 增强复选框和单选按钮](https://github.com/fronteed/iCheck)

- [Switchery - iOS 7 style switches for your checkboxes](https://github.com/abpetkov/switchery)

### 10.4 上传组件 ###

- [jQuery File Upload Plugin](https://github.com/blueimp/jQuery-File-Upload)

- [百度 Web Uploader](http://fex-team.github.io/webuploader/)

- [uploadify](http://www.uploadify.com/)

- [Plupload](https://github.com/moxiecode/plupload)

- [Fine Uploader](http://fineuploader.com/index.html)

- [arale-upload - 轻量级 iframe and html5 file uploader](https://github.com/aralejs/upload)

- [Dropzone.js - 文件上传库(可获取文件mime, 文件大小等; 针对图片可生成缩略图,获取图片宽度,高度)](https://github.com/enyo/dropzone)

- [flow.js](https://github.com/flowjs/flow.js)

- [localResizeIMG - 前端本地客户端压缩图片，兼容IOS，Android，PC](https://github.com/think2011/localResizeIMG)

- [simple-uploader](https://github.com/mycolorway/simple-uploader)

### 10.5 日期选择 ###

- [Both Date and Time picker widget based on twitter bootstrap](https://github.com/smalot/bootstrap-datetimepicker)

- [GMU 日历组件](http://gmu.baidu.com/demo/widget/calendar/calendar.html)

- [Mobiscroll](https://github.com/acidb/mobiscroll)

- [Pikaday - 日期选择器](https://github.com/dbushell/Pikaday)

- [PriceCalendar - 酒店价格日历](https://github.com/fugm/PriceCalendar)

  - [API文档](http://fgm.cc/learn/calendar/price-calendar/api.html)  

  - [DEMO](http://fgm.cc/learn/calendar/price-calendar/)

### 10.6 取色 ###

- [Colorpicker plugin for Twitter Bootstrap](https://github.com/mjolnic/bootstrap-colorpicker)

### 10.7 标签插件(Tag) ###

- [TaggingJS – 可以灵活定制的 jQuery 标签系统插件](https://github.com/sniperwolf/taggingJS)

- [selectize.js](https://github.com/brianreavis/selectize.js)

- [Bootstrap Tags Input](https://github.com/timschlechter/bootstrap-tagsinput/)

### 10.8 自动完成插件 ###

- [At.js - 一个Twitter/微博样式的@自动完成插件](https://github.com/ichord/At.js)

- [jquery-textcomplete - 智能搜索提示框/自动补全](https://github.com/yuku-t/jquery-textcomplete)

- [typeahead.js - a fast and fully-featured autocomplete library](https://github.com/twitter/typeahead.js)

### 10.9 样式修正 ###

- [autosize - 使文本框自动适应所输入的内容](https://github.com/jackmoore/autosize)

## 11. 图表绘制/图形库(Graphics) ##

- [Highcharts](https://github.com/highslide-software/highcharts.com)

- [Chart.js - Simple HTML5 Charts using Canvas](https://github.com/nnnick/Chart.js)

- [百度 ECharts](https://github.com/ecomfe/echarts)

- [Chartist.js](https://github.com/gionkunz/chartist-js)

- [D3.js - A JavaScript visualization library for HTML and SVG.](https://github.com/mbostock/d3)

  - [intro-to-d3 - a D3.js tutorial](https://github.com/square/intro-to-d3) 

- [Bonsai - 一个功能强大的JavaScript图形库](https://github.com/uxebu/bonsai)

- [epoch - 数据图表可视化](https://github.com/fastly/epoch/)

- [Vis.js](https://github.com/almende/vis)

- [Coutour.js](https://github.com/forio/contour)

- [zrender - 一个轻量级的Canvas类库，MVC封装，数据驱动，提供类Dom事件模型，让canvas绘图大不同！](https://github.com/ecomfe/zrender)

## 12. 日期格式化 & 时间轴 ##

- [Moment.js - 日期处理](http://momentjs.com/)

- [Smart Time Ago - 显示相对时间](https://github.com/pragmaticly/smart-time-ago)

- [timeline.js](https://github.com/vorg/timeline.js)

## 13. 页面交互

### 13.1 Slider ###

- [slick - the last carousel you'll ever need](https://github.com/kenwheeler/slick/)

- [Swipe - the most accurate touch slider](https://github.com/thebird/Swipe)

- [Swiper - Most modern mobile touch slider](https://github.com/nolimits4web/Swiper)

- [iscroll - Smooth scrolling for the web](https://github.com/cubiq/iscroll)

- [iSlider - 移动端滑动组件](https://github.com/BE-FE/iSlider)

- [OwlCarousel - create beautiful responsive carousel slider](https://github.com/OwlFonk/OwlCarousel)

- [jquery-mousewheel - jQuery鼠标滚轮滚动侦测插件](https://github.com/jquery/jquery-mousewheel/)

- [Glide.js - 轻量级滑块组件](https://github.com/jedrzejchalubek/Glide.js)

- [PhotoSwipe](https://github.com/dimsemenov/photoswipe)

- [TouchSlide - 触屏滑动特效(焦点图,Tab切换)](http://www.superslide2.com/TouchSlide/)

### 13.2 瀑布流 ###

- [Masonry](http://masonry.desandro.com/)

- [Isotope - Filter & sort magical layouts](http://isotope.metafizzy.co/)

### 13.3 懒加载/加载监听/预加载 ###

- [imagesLoaded](https://github.com/desandro/imagesloaded)

- [Echo.js](https://github.com/toddmotto/echo)

- [lazySizes](https://github.com/aFarkas/lazysizes)

- [jquery_lazyload](https://github.com/tuupola/jquery_lazyload)

- [BttrLazyLoading](https://github.com/shprink/bttrlazyloading/)

- [lazyload.js](https://github.com/vvo/lazyload)

- [layzr.js - 一个小巧快速的图片懒加载库](https://github.com/callmecavs/layzr.js)

- [waitForImages - 图片加载监听库](https://github.com/alexanderdickson/waitForImages)

- [PxLoader - JS预加载库:实现图片、声音等各种文件的预加载功能](https://github.com/thinkpixellab/PxLoader)

- [bindWithDelay - jQuery Plugin For Delayed Event Execution](https://github.com/bgrins/bindWithDelay)

- [TypeWatch - 停止输入时调用](https://github.com/dennyferra/TypeWatch)

### 13.4 图片轮播(幻灯片)/图片展示  ###

- [FlexSlider](https://github.com/woothemes/FlexSlider)

- [unslider - 小而美的轮播库](https://github.com/idiot/unslider)

- [prettyPhoto](https://github.com/scaron/prettyphoto)

- [FlickerPlate - A cool jQuery plugin that lets you flick through content.](https://github.com/chrishumboldt/Flickerplate)

- [Holder.js - Client-side image placeholders.](https://github.com/imsky/holder)

- [RowGrid.js - 在径直的行里放置图片](https://github.com/brunjo/rowGrid.js)

- [ImageLightbox.js - 灯箱效果](http://osvaldas.info/examples/image-lightbox-responsive-touch-friendly/)

- [JQuery Panorama Viewer - 全景视图](https://github.com/peachananr/panorama_viewer)

- [Intense Images - 全屏查看图片](https://github.com/tholman/intense-images)

- [Picturefill - 一个响应式图片 JS 插件](http://scottjehl.github.io/picturefill/)

- [zoom.js - 一个 jQuery 图片放大插件](https://github.com/fat/zoom.js)

- [watermarkjs - 一个在浏览器中添加图片水印的 JS 库](https://github.com/brianium/watermarkjs)

- [responsive-images.js](https://github.com/kvendrik/responsive-images.js)

### 13.5 图片剪裁/图片处理 ###

- [Jcrop -  Image Cropping Plugin for jQuery](https://github.com/tapmodo/Jcrop)

- [croppic - an image cropping jquery plugin](https://github.com/sconsult/croppic)

- [smartcrop.js - 智能图片裁剪库](https://github.com/jwagner/smartcrop.js)

- [jQuery.eraser - 图像擦除插件](https://github.com/boblemarin/jQuery.eraser)

- [DD_belatedPNG.js - 让IE6支持透明PNG图片](http://www.dillerdesign.com/experiment/DD_belatedPNG/)

- [FocusPoint.js 实现图片的响应式裁剪](https://github.com/jonom/jquery-focuspoint)

- [imgareaselect](https://github.com/odyniec/imgareaselect)

- [CSSgram - CSS 实现的 Instagram 滤镜库](https://github.com/una/CSSgram)

- [antimoderate - 图片模糊库](https://github.com/whackashoe/antimoderate)

### 13.6 进度条/加载动画(Loading) ###

- [NProgress.js](http://ricostacruz.com/nprogress/)

- [progress.js](https://github.com/usablica/progress.js)

- [Pace - Automatic page load progress bar](https://github.com/HubSpot/pace)

- [jquery-ajax-progress](https://github.com/englercj/jquery-ajax-progress)

- [nanobar - Very lightweight progress bars.](https://github.com/jacoborus/nanobar)

- [waitMe - 很漂亮的loading效果](https://github.com/vadimsva/waitMe)

- [spin.js](https://github.com/fgnass/spin.js)

- [sonic.js](https://github.com/padolsey/sonic.js)

- [fakeLoader.js](https://github.com/joaopereirawd/fakeLoader.js)

- [loaders.css - 一个为性能优化的实现加载动画效果的 CSS 框架](https://github.com/ConnorAtherton/loaders.css)

- [css-loaders](https://github.com/lukehaas/css-loaders)

### 13.7 侧滑插件(offcancas) ###

- [pushy -  a responsive off-canvas navigation menu ](https://github.com/christophery/pushy)

- [Slideout.js - 一个用于移动 Web 应用的触摸滑出式导航菜单](https://github.com/mango/slideout)

### 13.8 菜单(Menu) ###

- [SuperFish - 基于jQuery的级联下拉菜单](https://github.com/joeldbirch/superfish)

- [Responsive Nav - 响应式导航](https://github.com/viljamis/responsive-nav.js)

### 13.9 滚动侦测(ScrollSpy) ###

- [jquery-scrollspy(1)](https://github.com/sxalexander/jquery-scrollspy)

- [jquery-scrollspy(2)](https://github.com/thesmart/jquery-scrollspy)

- [Waypoints](https://github.com/imakewebthings/waypoints)

- [ScrollMagic - 像进度条一样使用滚动条](https://github.com/janpaepke/ScrollMagic)

### 13.10 滚动加载更多/下拉刷新(Pull to Refresh) ###

- [jScroll](https://github.com/pklauzinski/jscroll)

- [web-pull-to-refresh](https://github.com/apeatling/web-pull-to-refresh)

- [pulltorefresh](https://github.com/dwcares/pulltorefresh)

- [RubberBand.js - add pull-to-refresh functionality to any page.](https://github.com/ThrivingKings/RubberBand.js)

### 13.11 平滑滚动插件(Smooth Scroll) ###

- [jquery-smooth-scroll](https://github.com/kswedberg/jquery-smooth-scroll)

- [jquery.scrollTo - 平滑滚动到页面指定位置](https://github.com/flesler/jquery.scrollTo)

- [smooth-scroll](https://github.com/cferdinandi/smooth-scroll)

- [scrollUp](https://github.com/markgoodyear/scrollup)

- [elevator.js - 一个模拟电梯运行“返回顶部”的 JS 插件](https://github.com/tholman/elevator.js)

### 13.12 全屏滚动/全屏切换 ###

- [pagePiling.js - 全屏滚动效果](https://github.com/alvarotrigo/pagePiling.js)

- [fullPage.js](https://github.com/alvarotrigo/fullPage.js/)

- [onepage-scroll](https://github.com/peachananr/onepage-scroll)

- [zepto.fullpage - 专注于移动端的fullPage.js](https://github.com/yanhaijing/zepto.fullpage)

- [screenfull.js - 切换全屏模式](https://github.com/sindresorhus/screenfull.js)

### 13.13 分屏滚动 ###

- [multiscroll.js - 分屏滚动效果](https://github.com/alvarotrigo/multiscroll.js)

### 13.14 转场效果 ###

- [Animsition - 页面切换时的过渡效果](https://github.com/blivesta/animsition)

### 13.15 固定元素(Sticky) ###

- [sticky - jQuery Plugin for Sticky Objects](https://github.com/garand/sticky)

- [jquery.pin - 固定页面元素](https://github.com/webpop/jquery.pin)

- [stickUp](https://github.com/LiranCohen/stickUp)

- [Slinky.js - 堆叠头部创建滑动导航列表](https://github.com/iclanzan/slinky)

### 13.16 触控事件 ###

- [Hammer.js](https://github.com/hammerjs/hammer.js)

- [jquery.event.move.js](https://github.com/stephband/jquery.event.move)

### 13.17 拖拽组件 ###

- [Draggabilly - 专注于拖拽功能的 JS 库](https://github.com/desandro/draggabilly)

- [dragula - 一个让拖放操作变简单的 JS 库](https://github.com/bevacqua/dragula)

- [GridList - 可拖拉的响应式列表库](https://github.com/uberVU/grid)

### 13.18 隐藏或展示页面元素 ###

- [Headroom.js - 在不需要页头时将其隐藏](http://www.bootcss.com/p/headroom.js/)

- [Readmore.js - 内容显示与隐藏插件](https://github.com/jedfoster/Readmore.js)

- [oriDomi - 像指一样折叠Dom元素](https://github.com/dmotz/oriDomi)

### 13.19 滚动条(Scrollbar) ###

- [jScrollPane](https://github.com/vitch/jScrollPane)

- [jquery.scrollbar](https://github.com/gromo/jquery.scrollbar)

- [perfect-scrollbar](https://github.com/noraesae/perfect-scrollbar)

- [nanoScrollerJS](https://github.com/jamesflorentino/nanoScrollerJS)

- [tinyscrollbar](https://github.com/wieringen/tinyscrollbar)

### 13.20 视差滚动(Parallax Scrolling) ###

- [parallax.js](https://github.com/wagerfield/parallax)

- [jparallax](https://github.com/stephband/jparallax)

- [skrollr](https://github.com/Prinzhorn/skrollr)

## 14. 代码高亮插件/代码编辑器 ##

- [google-code-prettify](https://code.google.com/p/google-code-prettify/)

- [highlight.js](https://highlightjs.org/)

- [Rainbow](http://craig.is/making/rainbows)

- [ACE](https://github.com/ajaxorg/ace)

- [CodeMirror](https://github.com/codemirror/codemirror)

- [Crayon Syntax Highlighter](https://github.com/aramk/crayon-syntax-highlighter)

- [prism - Lightweight, robust, elegant syntax highlighting.](https://github.com/PrismJS/prism)

## 15. UI Icon 组件 ##

- [Font Awesome](http://fontawesome.io/icons/)

- [Glyphter: The SVG Font Machine](http://glyphter.com/)

- [Perfect Icons](http://perfecticons.com/)

- [iconizr](http://iconizr.com/)

- [Cikonss - 纯CSS实现的响应式Icon](http://www.bootcss.com/p/cikonss/)

- [Simple Icons](https://github.com/danleech/simple-icons)

## 16. 动画(Animate) ##

- [animate.css - A cross-browser library of CSS animations.](https://github.com/daneden/animate.css)

- [Transit - CSS transitions and transformations for jQuery](https://github.com/rstacruz/jquery.transit)

- [WOW - 在滚动过程中展示CSS动画效果(默认触发animate.css动画)](https://github.com/matthieua/WOW)

- [AniJS - A Library to Raise your Web Design without Coding](https://github.com/anijs/anijs/)

- [Move.js - 简化CSS3动画的JS库](https://github.com/visionmedia/move.js)

- [ScrollMe – 在网页中加入各种滚动动画效果](https://github.com/nckprsn/scrollme)

- [Effeckt.css - A Performant Transitions and Animations Library](https://github.com/h5bp/Effeckt.css)

- [NEC动画库](http://nec.netease.com/library/category/#animation)

- [csshake - CSS classes to move your DOM](https://github.com/elrumordelaluz/csshake)

- [magic - CSS3 Animations with special effects](https://github.com/miniMAC/magic)

- [Hover.css - 很多鼠标Hover态的效果](https://github.com/IanLunn/Hover)

- [SpinKit](https://github.com/tobiasahlin/SpinKit)

- [Velocity.js - 加速JavaScript动画](https://github.com/julianshapiro/velocity)

- [lenticular.js - 响应倾斜或鼠标事件创建图片动画](https://github.com/thomasxiii/lenticular.js)

- [jQuery Interactive 3D - Create a 3D interactive object using images](https://github.com/peachananr/interactive_3d)

- [AnimateScroll - A Simple jQuery Plugin for Animating Scroll](https://github.com/ramswaroop/animatescroll.js)

- [Blast.js - 把动画和样式注入到文本中](https://github.com/julianshapiro/blast)

- [Bounce.js - 一个用于制作漂亮 CSS3 关键帧动画的 JS 库](https://github.com/tictail/bounce.js)

- [Sticker.js - create a Sticker Effect](https://github.com/cmiscm/stickerjs)

- [scrollReveal.js - 元素进入可视区域自动触发设置好的动画](https://github.com/julianlloyd/scrollReveal.js)

- [stroll.js - CSS3 list scroll effects](https://github.com/hakimel/stroll.js)

- [jQuery Easing -  动画效果扩展](https://github.com/gdsmith/jquery.easing)

- [animations - CSS3 ANIMATION CHEAT SHEET](http://www.justinaguilar.com/animations/index.html)

- [iconate.js：将 icons 增加动画效果的 JS 库](https://github.com/bitshadow/iconate)

## 17. 本地存储 ##

- [cross-storage - Cross domain local storage](https://github.com/zendesk/cross-storage)

- [localForage](https://github.com/mozilla/localForage)

- [pouchdb](https://github.com/pouchdb/pouchdb)

- [basil.js](https://github.com/Wisembly/basil.js)

- [Neurosync - JavaScript 本地离线 ORM 库](https://github.com/ClickerMonkey/neurosync)

## 18. 模板引擎 ##

- [mustache.js](https://github.com/janl/mustache.js)

- [Handlebars.js](http://www.jingwentian.com/t-66)

- [artTemplate](https://github.com/aui/artTemplate)

- [baiduTemplate](https://github.com/wangxiao/BaiduTemplate)

- [JSRender](https://github.com/BorisMoore/jsrender)

- [EJS - JavaScript Templates](https://github.com/tj/ejs)

- [Juicer - A Light Javascript Templete Engine.](https://github.com/PaulGuo/Juicer)

- [Tempo](https://github.com/twigkit/tempo)

- [json2html](https://github.com/moappi/json2html)

- [Hogan.js - JavaScript templating from Twitter.](https://github.com/twitter/hogan.js)

- [Dust.js - Linkedin维护的项目](https://github.com/linkedin/dustjs)

## 19. 通知组件/弹框组件/模态窗口 ##

- [Notify.js(Web Notifications API)](https://github.com/alexgibson/notify.js)

- [alertify.js](https://github.com/fabien-d/alertify.js)

- [AlertifyJS](https://github.com/MohammadYounes/AlertifyJS)

- [SweetAlert](https://github.com/t4t5/sweetalert)

- [Messenger - 非常酷的弹框组件](https://github.com/HubSpot/messenger)

- [PNotify](https://github.com/sciactive/pnotify)

- [Notify.js - A simple, versatile notification library](https://github.com/jpillora/notifyjs)

- [Remodal - 模态窗口插件](https://github.com/VodkaBears/Remodal)

- [action.js - 极简的tip和Modal弹窗效果](https://github.com/egoist/action.js)

## 20. 提示控件(Tooltips) ##

- [hint.css - 一款非常小巧的提示框效果](https://github.com/chinchang/hint.css)

- [qTip2 - Pretty powerful tooltips](https://github.com/qTip2/qTip2)

- [tooltip - CSS Tooltips](https://github.com/HubSpot/tooltip)

- [tooltipster - A jQuery tooltip plugin](https://github.com/iamceege/tooltipster)

- [grumble.js - 气泡形状的提示（Tooltip）控件](https://github.com/jamescryer/grumble.js)

- [Ouibounce - 离站提示控件](https://github.com/carlsednaoui/ouibounce)

- [intro.js - 一个创建引导式网站介绍功能的 JS 库](https://github.com/usablica/intro.js)

- [data-tip.css - 纯 CSS 实现的工具提示](https://github.com/egoist/data-tip.css)

## 21. 对话框/遮罩层/弹出层(lightbox) ##

- [fancyBox - Fancy jQuery lightbox](https://github.com/fancyapps/fancyBox)

- [jquery-lightbox - The popular lightbox script, ported to jQuery](https://github.com/krewenki/jquery-lightbox)

- [Colorbox - a jQuery lightbox](https://github.com/jackmoore/colorbox)

- [artDialog - 经典的网页对话框组件](https://github.com/aui/artDialog)

- [DialogEffects](https://github.com/codrops/DialogEffects)

- [jQuery blockUI - Page or element overlay](https://github.com/malsup/blockui/)

- [layer - web弹出窗/层](https://github.com/sentsin/layer/)

## 22. 文档/表格/PDF ##

- [Backgrid.js - 强大的表格组件](https://github.com/wyuenho/backgrid)

- [handsontable - 在线可编辑excel表格](https://github.com/handsontable/handsontable)

- [jQuery Bootgrid - 用于ajax生成动态表格](https://github.com/rstaib/jquery-bootgrid)

- [DataTables - Table plug-in for jQuery](https://github.com/DataTables/DataTables)

- [PDF.js - 一个 JavaScript 编写的 PDF 阅读器](https://github.com/mozilla/pdf.js)

- [jsPDF - Generate PDF files in JavaScript](https://github.com/MrRio/jsPDF)

- [Recline.js - 灵活操作和展示数据](https://github.com/okfn/recline/)

- [Dynatable - 交互式表格插件](https://github.com/alfajango/jquery-dynatable)

- [fattable - 创建无限滚动无限行列数的表格](https://github.com/fulmicoton/fattable)

## 23. 目录树插件 ##

- [zTree_v3 - jQuery Tree Plugin](https://github.com/zTree/zTree_v3)

- [jstree - jQuery Tree Plugin](https://github.com/vakata/jstree)

- [fancytree - Tree plugin for jQuery](https://github.com/mar10/fancytree)

## 24. Ajax模块

- [fetch - A window.fetch JavaScript polyfill](https://github.com/github/fetch)

- [reqwest - browser asynchronous http requests](https://github.com/ded/reqwest)

- [ajax - Standalone AJAX library](https://github.com/ForbesLindesay/ajax)

- [then-request](https://github.com/then/then-request)

- [browser-request](https://github.com/iriscouch/browser-request)

- [superagent](https://github.com/visionmedia/superagent)

- [minAjax.js](https://github.com/argunner/minAjax.js/)

## 25. 音频/视频 ##

- [jPlayer -  HTML5 Audio & Video for jQuery](https://github.com/happyworm/jPlayer)

- [video.js - HTML5 & Flash video player](https://github.com/videojs/video.js)

- [Accessible HTML5 Video Player - PayPal 开源的 HTML5 视频播放器](https://github.com/paypal/accessible-html5-video-player)

- [Clappr - 开源的Web视频播放器](https://github.com/clappr/clappr)

- [Plyr - A simple HTML5 media player](https://github.com/selz/plyr)

- [FitVids.js - A lightweight, easy-to-use jQuery plugin for fluid width video embeds.](https://github.com/davatron5000/FitVids.js)

- [BigVideo.js - The jQuery Plugin for Big Background Video](https://github.com/dfcb/BigVideo.js)

- [BigScreen - A simple library for using the JavaScript Full Screen API](https://github.com/bdougherty/BigScreen)

- [Vide - 视频背景](https://github.com/VodkaBears/Vide)

- [winamp2-js](https://github.com/captbaritone/winamp2-js)

- [Buzz - A Javascript HTML5 Audio library](https://github.com/jaysalvat/buzz)

- [MediaElement.js](http://github.com/johndyer/mediaelement/)

## 26. 按钮 ##

- [Buttons - A CSS button library](https://github.com/alexwolfe/Buttons)

- [ButtonComponentMorph](https://github.com/codrops/ButtonComponentMorph)

- [ProgressButtonStyles](https://github.com/codrops/ProgressButtonStyles)

- [CreativeButtons](https://github.com/codrops/CreativeButtons)

- [CSS3 buttons](https://github.com/ubuwaits/css3-buttons)

- [jquery.onoff - Interactive, accessible toggle switches for the web.](https://github.com/timmywil/jquery.onoff)

## 27. 富文本编辑器/Markdown编辑器/Markdown解析器 ##

- [Simditor - 简单快速的富文本编辑器](https://github.com/mycolorway/simditor)

- [BachEditor - 一个有情怀的编辑器](https://github.com/Integ/BachEditor)

- [TinyMCE](https://github.com/tinymce/tinymce)

- [bootstrap-markdown](https://github.com/toopay/bootstrap-markdown)

- [marked - markdown解析器](https://github.com/chjj/marked)

- [Markdown Plus](https://github.com/tylingsoft/markdown-plus)

- [Editor.md - 开源在线Markdown编辑器](https://github.com/pandao/editor.md)

- [stackedit](https://github.com/benweet/stackedit)

- [Redactor Text Editor](http://imperavi.com/redactor/)

- [micromarkdown.js - 轻量级的md解析器](https://github.com/simonwaldherr/micromarkdown.js/)

- [wangEditor - 支持移动端的轻量级web富文本框](https://github.com/wangfupeng1988/wangEditor)

## 28. 内容提取(Readability) ##

- [Readability](https://code.google.com/p/arc90labs-readability/)

- [json.human.js - Json Formatting for Human Beings](https://github.com/marianoguerra/json.human.js)

## 29. 颜色(CSS Colors)/SVG/Canvas ##

- [CSS Colours](http://colours.neilorangepeel.com/)

- [SVGeneration](http://www.svgeneration.com/)

- [SVGMagic - 自动的创建PNG来兼容不支持SVG的浏览器](https://github.com/dirkgroenen/SVGMagic)

- [Adaptive Backgrounds - 从图片抽取主要颜色和应用到父元素](https://github.com/briangonzalez/jquery.adaptive-backgrounds.js)

- [Seen.js - 渲染3D场景为SVG或者HTML Canvas](https://github.com/themadcreator/seen)

## 30. 选项卡(Tabs) ##

- [Easy Responsive Tabs to Accordion](https://github.com/samsono/Easy-Responsive-Tabs-to-Accordion)

- [Responsive-Tabs](https://github.com/jellekralt/Responsive-Tabs)

- [ion.tabs - jQuery tabs plugin](https://github.com/IonDen/ion.tabs)

- [jQuery-EasyTabs](https://github.com/JangoSteve/jQuery-EasyTabs)

- [tabulous.js](https://github.com/aarondo/tabulous.js)

## 31. 文本处理 ##

- [ZeroClipboard - 文本复制插件](https://github.com/zeroclipboard/zeroclipboard)

- [clipboard.js](https://github.com/zenorocha/clipboard.js/)

- [Bigfoot - 点击文章中的脚注弹窗显示](https://github.com/lemonmade/bigfoot)

- [Annotator - 文本注解插件，可以包括注释、标签、用户等](https://github.com/openannotation/annotator)

- [Succinct - 用作截断多行文本,后面添加省略号](https://github.com/micjamking/Succinct)

- [Flowtype.js - 自动调整字体大小和行号](https://github.com/simplefocus/FlowType.JS)

- [flat-shadow](https://github.com/peachananr/flat-shadow)

- [FitText - A jQuery plugin for inflating web type](https://github.com/davatron5000/FitText.js)

- [shine.js - 实现漂亮阴影](https://github.com/bigspaceship/shine.js)

- [Type Rendering Mix - 文本渲染引擎](https://github.com/bramstein/trmix/)

- [jquery-expander - 阅读更多](https://github.com/kswedberg/jquery-expander)

- [Typed.js - 输入模拟插件](https://github.com/mattboldt/typed.js/)

- [jQuery.dotdotdot - 多行文本溢出显示省略号](https://github.com/FrDH/jQuery.dotdotdot)

## 32. 布局(Layout) ##

- 分隔面板(Split Panel)

  - [split-pane](https://github.com/shagstrom/split-pane)

  - [jQuery UI Layout](http://layout.jquery-dev.com/)

## 33. 演示/幻灯片 ##

- [reveal.js - The HTML Presentation Framework](https://github.com/hakimel/reveal.js)

- [bespoke.js - DIY Presentation Micro-Framework](https://github.com/markdalgleish/bespoke.js)

- [impress.js](https://github.com/bartaz/impress.js)

- [shower](https://github.com/shower/shower)

- [deck.js](https://github.com/imakewebthings/deck.js)

## 34. 国际化(i18n) ##

- [jquery-i18n](https://github.com/recurser/jquery-i18n)

- [i18next.js](https://github.com/i18next/i18next)

- [jsperanto.js](https://github.com/jpjoyal/jsperanto)

- [jed.js](https://github.com/SlexAxton/Jed)

- [messageformat.js](https://github.com/SlexAxton/messageformat.js)

- [Polyglot.js](https://github.com/airbnb/polyglot.js)

## 35. 邮件模板(Email Templates) ##

- [responsive-html-email-template](https://github.com/leemunroe/responsive-html-email-template)

## 36. 移动端优化(Optimizing Mobile Performance) ##

- [FastClick - 处理移动端 click 事件 300 毫秒延迟](https://github.com/ftlabs/fastclick)

- [tappy](https://github.com/filamentgroup/tappy/)

- [jquery-fast-click](https://github.com/dave1010/jquery-fast-click)

## 37. HTTP请求相关 ##

- [pako - HTTP 请求正文压缩](https://github.com/nodeca/pako)

  - [参考阅读: 如何压缩 HTTP 请求正文](https://imququ.com/post/how-to-compress-http-request-body.html)

  - [HTTP 请求正文压缩 DEMO](https://qgy18.com/request-compress/)

- [RSA in JavaScript - 用RSA加密实现Web数据加密传输](http://www.ohdave.com/rsa/)

## 38. 实用工具/其他插件 ##

- [jquery-cookie](https://github.com/carhartl/jquery-cookie)

- [InstantClick - 预加载用户可能会点击的一些链接](https://github.com/dieulot/instantclick/)

- [Async.js - 异步操作](https://github.com/caolan/async)

- [html2canvas - 实现纯JS网页截图](https://github.com/niklasvh/html2canvas)

- [jquery.qrcode.js - 生成二维码的 jQuery 插件](https://github.com/jeromeetienne/jquery-qrcode)

- [qrcodejs - JS生成QRCode的库](https://github.com/davidshimjs/qrcodejs)

- [nakedpassword - 用脱衣女帮助检测密码强度](https://github.com/platform45/nakedpassword)

- [KityMinder - 脑图编辑工具](https://github.com/fex-team/kityminder)

- [MixitUp - 动画过滤和排序](https://github.com/patrickkunka/mixitup)

- [JQuery Tip Cards - 创建卡片交互的cards布局](https://github.com/peachananr/tip_cards)

- [Fallback.js - JavaScript library for dynamically loading CSS and JS files.](https://github.com/dolox/fallback/)

- [swfobject](https://github.com/swfobject/swfobject)

- [prettyprint.js - An in-browser JavaScript variable dumper](https://github.com/padolsey-archive/prettyprint.js)

- [Shepherd - 为应用创建用户指南](https://github.com/HubSpot/shepherd)

- [RulersGuide.js - 类似PhotoShop标尺的js库](https://github.com/mark-rolich/RulersGuides.js)

- [Gremlins.js - Monkey 测试库](https://github.com/marmelab/gremlins.js)

- [RoughDraft.js - 简单快速的创建交互式的 HTML 模型的原型工具](https://github.com/ndreckshage/roughdraft.js/)

- [favico.js - 动态改变浏览器标签栏中的网站图标](https://github.com/ejci/favico.js)

#设计模式( JavaScript Patterns )

- [javascript-patterns](https://github.com/shichuan/javascript-patterns)

- [jquery-patterns - A variety of jQuery plugin patterns](https://github.com/jquery-boilerplate/jquery-patterns)

- [Learning JavaScript Design Patterns](http://addyosmani.com/resources/essentialjsdesignpatterns/book/)

#在线工具( Online Tools )

- [jsbin - Collaborative JavaScript Debugging App](http://jsbin.com)

  - [jsbin@Github](https://github.com/jsbin/jsbin)

- [jsfiddle](http://jsfiddle.net/)

- [jsbeautifier - Online JavaScript beautifier](http://jsbeautifier.org/)

- [resume.github.com](http://resume.github.io)

# 前端开发工具 #

## 1. 开发工具 ##

- [Sublime Text](http://www.sublimetext.com/)

## 2. 调试工具 ##

- [Fiddler](http://www.telerik.com/fiddler)

- [Weinre](http://people.apache.org/~pmuellr/weinre-docs/latest/Home.html)

- [Rythem](http://www.alloyteam.com/2012/05/web-front-end-tool-rythem-1/)

- [csscss - 用于检查css代码冗余](https://github.com/zmoazeni/csscss)

- [FECS - 基于 Node.js 的前端代码检查工具](http://fecs.baidu.com/)

## 3. 浏览器扩展(Chrome Extensions) ##

- [Postman - REST Client](https://chrome.google.com/webstore/detail/postman-rest-client/fdmmgilgnpjigdojojpjoooidkmcomcm)

- [Fiddler - Fiddler for Chrome Extension](http://welefen.github.io/Fiddler/)

- [WEB前端助手(FeHelper)](https://chrome.google.com/webstore/detail/web%E5%89%8D%E7%AB%AF%E5%8A%A9%E6%89%8Bfehelper/pkgccpejnmalmdinmhkkfafefagiiiad)

- [Web Developer](https://chrome.google.com/webstore/detail/web-developer/bfbameneiokkgbdmiekhjnmfkcnldhhm)

- [Chrome Logger](https://chrome.google.com/webstore/detail/chrome-logger/noaneddfkdjfnfdakjjmocngnfkfehhd)

- [ColorZilla](https://chrome.google.com/webstore/detail/colorzilla/bhlhnicpbhignbdhedgjhgdocnmhomnp)

- [ColorPick Eyedropper](https://chrome.google.com/webstore/detail/colorpick-eyedropper/ohcpnigalekghcmgcdcenkpelffpdolg?hl=en)

- [Code Cola](https://chrome.google.com/webstore/detail/code-cola/lomkpheldlbkkfiifcbfifipaofnmnkn)

- [1px](https://chrome.google.com/webstore/detail/1px/gebccnmciopflhcdihopmphapifkkfdh)

- [AlloyDesigner - 前端重构开发辅助工具](https://chrome.google.com/webstore/detail/alloydesigner/ojooeaohlmgpcjajikhmibcnbebfenid)

- [Fontface Ninja](https://chrome.google.com/webstore/detail/fontface-ninja/eljapbgkmlngdpckoiiibecpemleclhh)

- [PageSpeed Insights (by Google)](https://chrome.google.com/webstore/detail/pagespeed-insights-by-goo/gplegfbjlmmehdoakndmohflojccocli)

- [HTTP Status](https://chrome.google.com/webstore/detail/http-status/cknfnacbckhfpjahnmkblajcpledpfnp/related)

- [Redirect Path](https://chrome.google.com/webstore/detail/redirect-path/aomidfkchockcldhbkggjokdkkebmdll/related)

- [Responsive Web Design Tester](https://chrome.google.com/webstore/detail/responsive-web-design-tes/objclahbaimlfnbjdeobicmmlnbhamkg?hl=en)

- [Window Resizer](https://chrome.google.com/webstore/detail/window-resizer/kkelicaakdanhinjdeammmilcgefonfh?hl=en)

- [CSSViewer](https://chrome.google.com/webstore/detail/cssviewer/ggfgijbpiheegefliciemofobhmofgce?hl=en)

- [IE Tab](https://chrome.google.com/webstore/detail/ie-tab/hehijbfgiekmjfkfjpbkbammjbdenadd?hl=en)

- [Clear Cache](https://chrome.google.com/webstore/detail/clear-cache/cppjkneekbjaeellbfkmgnhonkkjfpdn?hl=en)

- [JSONView](https://chrome.google.com/webstore/detail/clear-cache/cppjkneekbjaeellbfkmgnhonkkjfpdn/related?hl=en)

- [Image Downloader](https://chrome.google.com/webstore/detail/image-downloader/cnpniohnfphhjihaiiggeabnkjhpaldj)

- [Pretty Beautiful Javascript - 可以自动格式化混淆的js文件](https://chrome.google.com/webstore/detail/pretty-beautiful-javascri/piekbefgpgdecckjcpffhnacjflfoddg/related?utm_source=chrome-ntp-icon)

- [JavaScript Errors Notifier](https://chrome.google.com/webstore/detail/javascript-errors-notifie/jafmfknfnkoekkdocjiaipcnmkklaajd?utm_source=chrome-ntp-icon)

- [CSS Diff - 在线比对页面上两个元素的CSS样式差异](https://chrome.google.com/webstore/detail/css-diff/pefnhibkhcfooofgmgoipfpcojnhhljm/related)

- [WhatFont- 识别网页所使用的字体](https://chrome.google.com/webstore/detail/whatfont/jabopobgcpjmedljpbcaablpmlmfcogm)

# 前端参考集 #

- [frontend-guidelines - Some HTML, CSS and JS best practices.](https://github.com/bendc/frontend-guidelines)

- [frontend-dev-bookmarks](https://github.com/dypsilon/frontend-dev-bookmarks)

- [Codrops - Useful resources](https://github.com/codrops)

- [Front-end Code Standards & Best Practices](http://isobar-idev.github.io/code-standards/)

- [frontend-dev-bookmarks](https://github.com/dypsilon/frontend-dev-bookmarks)

- [Airbnb 的 JavaScript 编码规范](https://github.com/airbnb/javascript)

- [awesome-javascript](https://github.com/wwsun/awesome-javascript)