直接拿来用！最火前端开源项目（三）

摘要：在前面的（一）、（二）中为开发者提供了十九个类别的开源项目列表，你们是否会感到目不暇接呢？没关系，只要对你有所帮助，我们的目的也就达到了，这里继续向你推荐剩下的二十六个类别的开源项目列表，供你查阅。

在《直接拿来用！最火前端开源项目（一）、（二）》中提供了十九个类别的开源项目列表，开发者们是否会目不暇接呢？没关系，只要对你有所帮助，我们的目的也就达到了，这里继续向你推荐剩下的二十六个类别的开源项目列表，供你查阅。

二十、Template Engines

模板引擎是为了使用户界面与数据分离而产生的，它可以生成特定格式的文档。使用模板引擎可以提升开发者的工作效率，该模板所拥有的良好设计也使得代码重用变得更加容易。





（1）ICanHaz.js：是一个简单而且功能强大的客户端的JavaScript模板引擎

（2）Hogan.js：是来自Twitter的JavaScript模板引擎

（3）Handlebars.js：是一个JavaScript的页面模板库

（4）Transparency

（5）doT.js：包含为浏览器和Node.js准备的JavaScript模板引擎

（6）Walrus

（7）Chibi

（8）Templayed.js：是一个兼容Mustache的JavaScript模板引擎，具有速度最快、体积最小等特性

（9）ECT

（10）pithy：JavaScript中为生成HTML的一个内部DSL

（11）T：T.js是一个模板引擎,使用简单的Javascript数据结构来表示HTML/XML数据。

（12）Nunjucks：是一个功能全面的JavaScript模板引擎。

（13）Linked.in Dust.js

The client-side templating throwdown:：mustache,
handlebars, dust.js, and more
Leaving JSPs in the dust: moving LinkedIn
to dust.js client-side templates
Tutorial
Testing Console

二十一、RoutingAndUrls

（1）Crossroads.js

（2）Hash.js

（3）director

（4）Davis.js

（5）path.js

（6）URI.js

（7）Roadcrew.js

（8）jQuery Address

（9）page.js

二十二、Rich Text Editors

富文本编辑器（Rich Text Editor，简称 RTE）：是一种可内嵌于浏览器，所见即所得的文本编辑器。它提供类似于Microsoft Word的编辑功能，即使不会编写容易HTML 的用户也能使用。





（1）WYSIHTML5：是一个开源的基于HTML技术的富文本编辑器，可生成完全兼容 HTML5 标签的文本

（2）MarkItUp：是一个轻量级、可定制、灵活的编辑器

（3）Hallo

（4）Substance Composer

（5）Proper

（6）SnapEditor

（7）Create.js

（8）MDMagick

（9）X-editable

二十三、Code Viewers & Editors

（1）Rainbow.js

（2）Intelligist

（3）Prism.js

（4）Brackets： Adobe用JavaScript、HTML 和CSS写的基于Web的开源代码编辑器

（5）CodeMirror

（6）Scripted

（7）tabIndent.js

（8）Behave.js：是一个轻量级的JavaScript库,为普通的text areas编辑框提供了IDE风格的行为，让它更适合书写代码。

二十四、Performance

（1）Writing Fast, Memory-Efficient JavaScript

（2）CSS-only:Load images on demand

（3）Videos

Faster HTML and CSS: Layout Engine Internals for Web Developers
Google I/O 2012 - Breaking the JavaScript Speed Limit with V8
DOM, HTML5, & CSS3 Performance
Nicholas Zakas | High Performance Javascript
Building A Performant HTML5 App

（4）General Information

Writing Fast, Memory-Efficient JavaScript
JavaScript Performance Best Practices
Improving the performance of your HTML5 App
Best Practices for a Faster Web App with HTML5
Front-end performance for web designers and front-end
developers

（5）Memory

Memory 101
Memory leak patterns in JavaScript
Understanding and Solving Internet Explorer Leak Patterns
Finding memory leaks
How to write low garbage real-time Javascript
JScript Memory Leaks
Tracking Down Memory Leaks in Node.js
Effectively Managing Memory at Gmail scale

（6）Tools

Chrome Developer Tools

Heap Profiling
Profiles Panel
JavaScript Profiling With The Chrome Developer Tools
Introduction to Chrome Developer Tools, Part One

V8

Optimizing for V8
I-want-to-optimize-my-JS-application-on-V8 checklist
Performance tips for JavaScript in V8

JavaScript Leak Finder

Introduction Article

Navigation Timing
Firebug Paint Events
Locache：是一个JavaScript缓存框架，用于在浏览器上使用localStorage进行数据的缓存

（7）DOM Manipulation

Rendering: repaint, reflow/relayout, restyle
Reflows & Repaints: CSS Performance
making your JavaScript slow?
The new game show: "Will it reflow?"
When does reflow happen in a DOM environment?
Speeding up JavaScript: Working with the DOM
Efficient JavaScript
When Does JavaScript trigger reflows and rendering
How (not) to trigger a layout in WebKit

（8）Animation

requestAnimationFrame for smart animating
Leaner, Meaner, Faster Animations with requestAnimationFrame
Collie - high performance Animation library
Using requestAnimationFrame to Optimize Dragging
Events
requestAnimationFrame API: now with Sub-Millisecond
Precision
Why moving elements with translate() is better than
pos:abs top/left

（9）Hardware Acceleration

Visualizing WebKit’s hardware acceleration
List of Chromium Command Line Switches

（10）Browser Internals

How Browsers Work: Behind the scenes of modern web browsers
How Browsers Work - Part 1 - Architecture
Know Your Engines at O’Reilly Velocity 2011
Video: GDC 2012: From Console to Chrome
Fast CSS: How Browsers Lay Out Web Pages
Video: What Browsers Really Think of Your App
WebKit blog five-part series on rendering
Video: Alex Russell - Life Of A Button Element
How a web page loads
Video: The Fundamentals, Primitives and History of HTML5
The JavaScript engine family tree
How JavaScript compilers work
JavaScript compiler strategies
The future for JavaScript

（11）HTTP Transport

Fantastic
front-end performance: Concatenate, Compress & Cache
Video: Cache Is King!

二十六、Modularity & Loaders

（1）Lazy Module Declaration

（2）UMD (Universal Module Definition) patterns

（3）Browserify

（4）require.js

Plugins

（5）CrapLoader

（6）Writing Modular JavaScript With AMD, CommonJS & ES Harmony

（7）Путь JavaScript модуля

（8）Modular JavaScript with RequireJS

（9）LABjs & RequireJS: Loading JavaScript Resources the Fun Way

（10）JavaScript Inheritance and Public/Private members

（11）Deep dive into the murky waters of script loading

（12）Terminology: Modules

二十七、Package Management

（1）bower

（2）volo

（3）parce

（4）jam.js

（5）component

二十八、Image Manipulation

（1）Paintbrush.js

（2）Obscura

（3）jCrop

二十九、HTTP

（1）Using CORS

（2）Cross-domain Ajax with Cross-Origin Resource Sharing

三十、Error Handling & Debugging

（1）Tracing.js

（2）JavaScript error handling anti-pattern

（3）Tattletale

三十一、Documentation

（1）dexy

（2）docco

（3）Ronn

（4）dox

（5）YUIDoc

（6）coddoc

三十二、Windows 8 Style







（1）Metro UI CSS

（2）BootMetro

（3）metro-bootstrap

（4）Metro UI Template

（5）Droptiles – Metro-Style Web Dashboard

（6）Metro JS

（7）Windows Metro tiles with Javascript and CSS3

（8）Cosmo

（9）Vid: What Web Developers Need to Know When Building Metro style Apps

（10）CSS3 Microsoft Modern Buttons

（11）Visual Studio 2012 Image Library - 5,000+ Images Downloadable Now

（12）Metro User Interface Implementation and Resources

三十三、Video

SublimeVideo

三十四、Audio

（1）howler.js

（2）Stratus 2soundcloud player

三十五、Library Collections

（1）jster

（2）MicroJS

（3）JSPkg

（4）TheToolbox

（5）Unheap

三十六、Chat

XMPP using JSON

三十七、Prototyping

（1）fixie

（2）Holder.js

三十八、JSON

（1）JSON Query Language

（2）Oboe.js

三十九、Presentations

（1）Ancesor.js

（2）Slideshow.html

（3）HTML5 Slideshow

（4）jQuery Screen

（5）reveal.js

（6）html5 Slides by Google

（7）Slides

（8）CSSS

（9）deck.js

（10）controldeck.js

四十、Scrolling

（1）Scrollpath

（2）jQuery NiceScroll

（3）FoldScroll

（4）Scrollorama

四十一、Keyboard

（1）Mousetrap

（2）Keypress

（3）konami.js

四十二、Tables & DataGrids







（1）Tablecloth.js

（2）Responsive Data Tables

（3）stacktable.js

（4）FooTable

（5）Handsontable

（6）Backgrid.js

（7）Gridster

（8）Flex

四十三、Security

（1）oAuth Consumer Library

ohauth
How iD Logs in to OpenStreetMap

（2）JSO - a Javascript OAuth Library

（3）xdoauthproxy

（4）JavaScript Cryptography

（5）Javascript Crypto Library

（6）Stanford Javascript Crypto Library

（7）mozilla / jwcrypto

（8）Critic

Javascript Cryptography Considered Harmful
Final post on Javascript crypto

四十四、Layout

（1）Shapeshift

（2）CollagePlus

四十五、Misc

（1）zip.js

（2）simpleCart.js

（3）Aware.js

（4）How to directly upload files to Amazon S3 from your client side web app

转载地址：http://www.csdn.net/article/2013-06-28/2816047-front-end-development