史上最全的前端资源汇总（中）

万邦Noah
247 阅读8分钟

35. 各大公司开源项目

各大公司开源项目地址
Facebook Projectscode.facebook.com/projects/we…
百度web前端研发部fex.baidu.com
百度EFEefe.baidu.com
百度githubgithub.com/fex-team
alloyteamwww.alloyteam.com
alloyteam-githuballoyteam.github.io
alloyteam-AlloyGameEnginegithub.com/AlloyTeam/A…
AlloyDesigneralloyteam.github.io/AlloyDesign… 即时修改，即时保存，设计稿较正，其它开发辅助工具
H5交互页编辑器AEditor介绍www.alloyteam.com/2015/06/h5-… H5动画交互页开发的工具介绍
AEditoraeditor.alloyteam.com H5动画交互页开发的工具
makaforum.maka.im/wordpress
值得订阅的weeklygithub.com/fenbility/w…
腾讯html5cube.qq.com
奇舞团开源项目75team.github.io
Qunar UEDued.qunar.com
Scratscrat.io

36. 生活常用

常用地址
ieBetter.js-让IE6-IE8拥有IE9+,Chrome等浏览器特性www.zhangxinxu.com/wordpress/2…
模拟键盘mottie.github.io/Keyboard
拼音github.com/hotoo/pinyi…
中国个人身份证号验证github.com/mc-zone/IDV…

37. 算法

算法地址
数据结构与算法 JavaScript 描述. 章节练习github.com/Ralph-Wang/…
常见排序算法（JS版）github.com/twobin/twob…
经典排序github.com/luofei2011/…
常见排序算法-js版本github.com/hechangmin/…
JavaScript 算法与数据结构 精华集github.com/lightningtg…
面试常考算法题精讲www.nowcoder.com/live/course…

38. 移动端

移动端地址
fastclickgithub.com/ftlabs/fast…
no-click-delaygithub.com/mmastrac/jq…

39. JSON

JSON地址
模拟生成JSON数据beta.json-generator.com
返回跨域JSONAPIjsonp.afeld.me

40. Html5

Html5地址
HTML5 有哪些让你惊艳的 demo？www.zhihu.com/question/24…

41. CSS

CSS地址
browserhacksbrowserhacks.com

42. 焦点图

焦点图地址
myfocusgithub.com/koen301/myf…
myfocus-官方演示站www.chhua.com/myfocus
SuperSlidev2.1 -- 大话主席www.superslide2.com
soChangewww.bujichong.com/sojs/soChan…

43. Ext, EasyUI, J-UI 及其它各种UI方案

43.1 Ext

Ext, EasyUI, J-UI 及其它各种UI方案地址
extjswww.sencha.com/products/ex…
ext4英文apidocs.sencha.com/extjs/4.0.7
ext4中文apiextjs-doc-cn.github.io/ext4api

43.2 EasyUI

EasyUI地址
jquery easyui 未压缩源代码jquery-easyui.googlecode.com/svn/trunk/s…

43.3 J-UI

J-UI地址
J-UIjui.org

43.4 Other

Other地址
MUI-最接近原生APP体验的高性能前端框架dcloudio.github.io/mui
Amaze UI中国首个开源 HTML5 跨屏前端框架amazeui.org
淘宝 HTML5 前端框架m.sui.taobao.org
KISSY - 阿里前端JavaScript库docs.kissyui.com
网易Nej - Nice Easy Javascriptnej.netease.com
Kendo UI MVVM Demodemos.telerik.com/kendo-ui/mv…
Bootstrapwww.bootcss.com
Smart UIsmartui.chinamzz.com
雅虎UI - CSS UIdeveloper.yahoo.com/yui/grids

44. 页面 社会化 分享功能

页面 社会化 分享功能地址
百度分享share.baidu.com pc端
JiaThisjiathis.com pc端
社会化分享组件developer.baidu.com/soc/share 移动端
ShareSDK 轻松实现社会化功能www.mob.com/#/index 移动端
友盟分享dev.umeng.com/social/andr… 移动端

45. 富文本编辑器

富文本编辑器地址
功能齐全 tinymcewww.tinymce.com
百度 ueditorueditor.baidu.com/website
经典的ckeditorckeditor.com
经典的kindeditorkindeditor.net
wysiwygwww.bootcss.com/p/bootstrap…
一个有情怀的编辑器。Bach's Editorinteg.github.io/BachEditor
tower用的编辑器github.com/mycolorway/…
summernote 编辑器github.com/summernote/…
html5编辑器neilj.github.io/Squire
XEditorlab.hustlzp.com/XEditor
wangEditorgithub.com/wangfupeng1…

46. 日历

46.1 PC

PC地址
经典my97www.my97.net/dp/demo/ind…
强大的独立日期选择器www.cnblogs.com/gbin1/archi…
fullcalendarfullcalendar.io
fullcalendar日历控件知识点集合blog.csdn.net/francislaw/…
中文apiblog.sina.com.cn/s/blog_9475…
农历日历github.com/zzyss86/Lun…
超酷的仿百度带节日日历老黄历控件www.sucaisj.com/jiaoben/dat…
日期格式化momentjs.com
大牛日历控件github.com/Johnqing/QP…
我群某管理作品github.com/Iamlars/dat…
input按位替换-官网digitalbush.com/projects/ma…
input按位替换-githubgithub.com/digitalBush…
bootstrap-daterangepickergithub.com/dangrossman…
国外30个插件集合www.vandelaydesign.com/30-best-fre…
JavaScript datepickerdbushell.com/2012/10/09/…
Datepair.jsjonthornton.github.io/Datepair.js
一个风格多样的日历github.com/glad/glDate…
弹出层式的全日历amsul.ca/pickadate.j…
jquery双日历www.daterangepicker.com

46.2 移动

移动地址
大气实用jQuery手机移动端日历日期选择插件www.frankdemo.cn/index.php?c…
jQuery Mobile 移动开发中的日期插件Mobiscrollmobiscroll.com

46.3 Date library

Date library地址
Datejsgithub.com/datejs/Date…
sugarjssugarjs.com/api/Date

47. 综合效果搜索平台

综合效果搜索平台地址
效果网www.jq22.com
17素材www.17sucai.com
常用的JavaScript代码片段microjs.com

48. 前端工程化

48.1 概述

概述地址
前端工具大全www.awesomes.cn
什么是前端工程化github.com/fouber/blog…

48.2 Gulp

Gulp地址
Gulp官网gulpjs.com
Gulp中文网www.gulpjs.com.cn
gulp资料收集github.com/Platform-CU…
Gulp：任务自动管理工具 - ruanyifengjavascript.ruanyifeng.com/tool/gulp.h…
Gulp插件gulpjs.com/plugins
Gulp不完全入门教程www.ido321.com/1622.html
为什么使用gulp?github.com/hjzheng/CUF…
Gulp安装及配合组件构建前端开发一体化www.dbpoo.com/getting-sta…
Gulp 入门指南github.com/nimojs/gulp…
Gulp 入门指南 - nimojsgithub.com/nimojs/blog…
Gulp入门教程markpop.github.io/2014/09/17/…
Gulp in Actionwww.imooc.com/video/5692
Gulp开发教程（翻译）www.w3ctech.com/topic/134
前端构建工具gulpjs的使用介绍及技巧www.cnblogs.com/2050/p/4198…

48.3 Grunt

Grunt地址
gruntjsgruntjs.com
Grunt中文网www.gruntjs.net

48.4 Fis

Fis地址
fis 官网fex-team.github.io/fis-site/in…
fisfis.baidu.com

49. 轮播图

49.1 pc图轮

pc图轮地址
单屏轮播sochangewww.jsfoot.com/jquery/demo…
左右按钮多图切换bxslider.com/examples/ca…
fullpage全屏轮播github.com/alvarotrigo…

49.2 移动端

移动端地址
无缝切换www.swipejs.com
滑屏效果www.idangero.us/swiper
全屏fullpagegithub.com/peunzhang/f…
单个图片切换github.com/qiqiboy/tou…
单个全屏切换github.com/peunzhang/s…
百度的切换库touch.code.baidu.com/examples.ht…
单个全屏切换github.com/peunzhang/i…
滑屏效果github.com/saw/touch-i…
旋转拖动设置baijs.com/tinycircles…
类似于swipe切换touchslider.com
支持多种形式的触摸滑动www.swiper.com.cn/demo/index.…
滑屏效果github.com/joker-ye/ma…
大话主席pc移动图片轮换www.superslide2.com
滑屏效果github.com/hahnzhu/par…
基于zepto的fullpagegithub.com/yanhaijing/…
[WebApp]定宽网页设计下，固定宽度布局开发WebApp并实现多终端下WebApp布局自适应www.cnblogs.com/plums/archi…
判断微信客户端的那些坑loo2k.com/blog/detect…
可以通过javascript直接调用原生分享的工具github.com/JefferyWang…
JiaThis 分享到微信代码www.jiathis.com/help/html/w…
聊聊移动端跨平台开发的各种技术fex.baidu.com/blog/2015/0…
前端自动化测试www.zhihu.com/question/29…
多种轮换图片ajccom.github.io/niceslider
滑动侧边栏mango.github.io/slideout

50. 文件上传

文件上传地址
百度上传组件fex.baidu.com/webuploader
上传blueimp.github.io/jQuery-File…
flash 头像上传www.hdfu.net
图片上传预览www.dropzonejs.com
图片裁剪elemefe.github.io/image-cropp…
图片裁剪-shearphotowww.shearphoto.com
jQuery图片处理www.oschina.net/project/tag…

51. 模拟select

模拟select地址
糖饼 selectaui.github.io/popupjs/doc…
flexselectgithub.com/rmm5t/jquer…
双selectloudev.com
select2select2.github.io

52. 取色插件

取色插件地址
类似 Photoshop 的界面取色插件www.jq22.com/plugin/367
jquery colorgithub.com/jquery/jque…
取色插件集合www.oschina.net/project/tag…
farbtastic 圆环＋正方形github.com/mattfarina/…

53. 城市联动

城市联动地址
jquery.cityselect.js基于jQuery+JSON的省市或自定义联动效果www.ijquery.cn/?p=360

54. 剪贴板

剪贴板地址
剪贴板github.com/zeroclipboa…
clipboard 最新的剪切方案zenorocha.github.io/clipboard.j…
不是Flash的剪贴板github.com/zenorocha/c…

55. 简繁转换

简繁转换地址
简繁转换github.com/BYVoid/Open…

56. 表格 Grid

表格 Grid地址
facebook表格facebook.github.io/fixed-data-…
类似于Excel编辑表格-handsontablehandsontable.com
bootstrap-table插件bootstrap-table.wenzhixin.net.cn
datatableswww.datatables.net

57. 在线演示

在线演示地址
js 在线编辑 - runjsrunjs.cn
js 在线编辑 - jsbinjsbin.com
js 在线编辑 - codepencodepen.io
js 在线编辑 - jsfiddlejsfiddle.net
java 在线编辑 - runjsideone.com
js 在线编辑 - hchartscode.hcharts.cn
js 在线编辑 - jsdmjsdm.com
sql 在线编辑 - sqlfiddlesqlfiddle.com
mozilla 在线编辑器thimble.mozilla.org

58. 播放器

播放器地址
Html5 VideoPlayergithub.com/zmmbreeze/D…

59. 粒子动画

粒子动画地址
Proton 烟花a-jie.github.io/Proton/#exa…

60. Nodejs

Nodejs地址
nodejs 篇幅比较巨大liuqing.pw
Node.js 包教不包会github.com/alsotang/no…
篇幅比较少www.rainweb.cn/article/cat…
node express 入门教程www.w3cfuns.com/article-559…
nodejs定时任务my.oschina.net/u/568264/bl…
一个nodejs博客60sky.com
【NodeJS 学习笔记04】新闻发布系统www.cnblogs.com/yexiaochai/…
过年7天乐，学nodejs 也快乐www.cnblogs.com/qqloving/p/…
七天学会NodeJSgithub.com/nqdeng/7-da…
Nodejs学习笔记（二）--- 事件模块www.cnblogs.com/zhongweiv/p…
nodejs入门www.cnblogs.com/liusuqi/p/3…
angularjs nodejsgithub.com/zensh/jsgen
从零开始nodejs系列文章blog.fens.me/series-node…
理解nodejsdebuggable.com/posts/under…
nodejs事件轮询blog.mixu.net/2011/02/01/…
node入门www.nodebeginner.org/index-zh-cn…
nodejs cmsourjs.com/detail/53e1…
Node初学者入门，一本全面的NodeJS教程ourjs.com/detail/529c…
NodeJS的代码调试和性能调优www.barretlee.com/blog/2015/1…

61. 性能优化

61.1 常规优化

常规优化地址
Javascript高性能动画与页面渲染www.infoq.com/cn/articles…
移动H5前端性能优化指南isux.tencent.com/h5-performa…
5173首页前端性能优化实践ued.5173.com/?p=1731
给网页设计师和前端开发者看的前端性能优化www.uisdc.com/front-end-p…
复杂应用的 CSS 性能分析和优化建议www.orzpoint.com/profiling-c…
张鑫旭——前端性能www.zhangxinxu.com/wordpress/t…
前端性能监控总结www.xiaoqiang.org/javascript/…
网站性能优化之CSS无图片技术udc.weibo.com/2013/05/%E7…
web前端性能优化进阶路www.aliued.cn/2013/01/20/…
前端技术：网站性能优化之CSS无图片技术my.eoe.cn/tuwandou/ar…
浏览器的加载与页面性能优化www.baiduux.com/blog/2011/0…
页面加载中的图片性能优化www.w3ctech.com/p/1503
Hey——前端性能www.feelcss.com/tag/%E5%89%…
html优化www.baiduux.com/blog/2010/0…
99css——性能www.99css.com/tag/%e6%80%…
Yslow——性能优化www.yslow.net/category.ph…
YSLOW中文介绍www.cnblogs.com/yslow
转一篇Yahoo关于网站性能优化的文章，兼谈本站要做的优化www.360ito.com/article/40.…
Yahoo!团队实践分享：网站性能www.360doc.com/content/10/…
网站性能优化指南：什么使我们的网站变慢？blog.jiasule.com/i/153
网站性能优化实践，减少加载时间，提高用户体验www.powereasy.net/helpyou/kno…
浅谈网站性能优化 前端篇www.umtry.com/archives/74…
前端重构实践之如何对网站性能优化？www.adinnet.cn/blog/design…
前端性能优化：使用媒体查询加载指定大小的背景图片www.gbin1.com/technology/…
网站性能系列博文www.mykuer.com/post/factor…
加载，不只是少一点点tgideas.qq.com/webplat/inf…
前端性能的测试与优化mzhou.me/article/953…
分享网页加载速度优化的一些技巧？www.gbin1.com/technology/…
页面加载中的图片性能优化www.f2es.com/images-byte…
web前端优化(基于Yslowwww.tcreator.info/webSchool/w…
网站性能优化工具大全www.qianduan.net/website-per…
【高性能前端1】高性能HTMLwww.alloyteam.com/2012/10/hig…
【高性能前端2】高性能CSSwww.alloyteam.com/2012/10/hig…
由12306谈谈网站前端性能和后端性能优化coolshell.cn/articles/64…
AlloyTeam——前端优化www.alloyteam.com/webfrontend…
毫秒必争，前端网页性能最佳实践www.cnblogs.com/developersu…
网站性能工具Yslow的使用方法blog.sina.com.cn/s/blog_6e9d…
前端工程与性能优化（上）：静态资源版本更新与缓存www.infoq.com/cn/articles…
前端工程与性能优化（下）：静态资源管理与模板框架www.infoq.com/cn/articles…
HTTPS连接的前几毫秒发生了什么blog.jobbole.com/48369
Yslowuicss.cn/yslow/#more…
Essential Web Performance Metrics — A Primer, Part 1blog.smartbear.com/web-perform…
Essential Web Performance Metrics — Part 2blog.smartbear.com/performance…
YUISlide,针对移动设备的动画性能优化jayli.github.io/blog/data/2…
Improving Site Performancejoelglovier.com/improving-s…
让网站提速的最佳前端实践segmentfault.com/a/119000000…
Why Website Speed is Importantsixrevisions.com/web-develop…
Need for Speed – How to Improve your Website Performancewww.devbridge.com/articles/ne…
阿里无线前端性能优化指南 (Pt.1 加载期优化github.com/amfe/articl…

61.2 优化工具

优化工具地址
JavaScript 性能分析新工具 OneProfilewww.html-js.com/article/308…
JavaScript 堆内存分析新工具 OneHeapwww.html-js.com/article/309…

61.3 在线工具

在线工具地址
google在线工具developers.google.com/speed/pages…
阿里测www.alibench.com
阿里-免费测试服务itest.aliyun.com
阿里-F2etest多浏览器兼容性测试解决方案github.com/alibaba/f2e…
js性能测试jsperf.com

62. 前端架构

前端架构地址
技术架构www.zhihu.com/topic/19612…
前端架构saito.im/note/The-Ar…
如何成为前端架构师www.zhihu.com/question/24…
关于前端架构-张克军hikejun.com/sharing/201…
百度腾讯offer比较（腾讯游戏VS百度基础架构）www.zhihu.com/question/25…
了解更多电商api接口
avatar
文章
阅读
粉丝