[TOC]
*****
# 相關(guān)文章
[騰訊 AlloyTeam 出品-簡單、高效的幀動畫生成工具](https://github.com/gkajs)
[Tencent AlloyTeam 2018](http://alloyteam.github.io/)
[2017 年用于 UI 設(shè)計的 9 大 JavaScript 動畫庫](https://coyee.com/article/compare/12174-the-top-9-animation-libraries-for-ui-designers-in-2017-sitepoint)
[CSS3 動畫卡頓性能優(yōu)化解決方案](http://web.jobbole.com/93965/)
# 框架
https://framework7.io/docs/dom7.html
https://discourse.aurelia.io/
# 流行庫
dayjs
# [Mediaelement.js](http://www.mediaelementjs.com)
Mediaelement.js是一款HTML5視頻和音頻統(tǒng)一的框架,支持IE,F(xiàn)irefox,Opera,Safari,Chrome和iPhone,ipad、Andriod等移動端。支持MP4,OGG,MP3,WMV,WebM,WAV,WMA文件格式以及與websrt文件標(biāo)題。
# rough
手繪出粗略草圖的效果
## [Axios](https://saucelabs.com/u/axios)
Axios 是一個基于 promise 的 HTTP 庫,可以用在瀏覽器和 node.js 中。
Features
從瀏覽器中創(chuàng)建 [XMLHttpRequests](https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest)
從 node.js 創(chuàng)建 [http](http://nodejs.org/api/http.html) 請求
支持 [Promise](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise) API
攔截請求和響應(yīng)
轉(zhuǎn)換請求數(shù)據(jù)和響應(yīng)數(shù)據(jù)
取消請求
自動轉(zhuǎn)換 JSON 數(shù)據(jù)
客戶端支持防御 [XSRF](http://en.wikipedia.org/wiki/Cross-site_request_forgery)
使用 cdn:
~~~
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
~~~
## [Pressure.js](https://github.com/stuyam/pressure/)
一款用于處理 force touch, 3D touch 和 pointer pressure 的 JS 庫。它擁有和大多數(shù)瀏覽器兼容的簡潔 API,內(nèi)置壓感設(shè)備識別工具。它還支持多指觸控。
## [Filepond](https://pqina.nl/filepond/)
Filepond 是一個用于文件上傳的極小的 JavaScript 庫。它提供很多種上傳方式:你可以拖拽、復(fù)制粘貼文件,瀏覽文件系統(tǒng),或者,去用一用這個庫的 API,內(nèi)置圖片優(yōu)化和自動圖片尺寸調(diào)整。
## [Nerv](https://github.com/NervJS/nerv/)
Nerv 是一款快速的、基于 virtual-dom 的 JavaScript 庫,可用作 React 的替代品。它十分輕量,兼容 IE8 和 React 16,且提供客戶端和服務(wù)端同構(gòu)渲染。它支持很多 React 16 的特性,比如 Error Boundaries、Portals 以及許多其他的特性。
## [List](https://github.com/funkia/list)
這個庫提供了一個快速的函數(shù)替代數(shù)組。它是不可變的,這使它成為那些正在嘗試函數(shù)式編程的人的最佳選擇。List 是在 TypeScript 中編寫的,并實現(xiàn)了所有 JavaScript 數(shù)組方法,還有其他一些額外的方法。
# 工具
## [Flow](https://flow.org/)
為JS提供靜態(tài)檢驗,從這“TypeScript vs Flow”,可以看到一些很有用的信息,包括針對這兩者客觀的比較。值得一提的是,我在使用Flow去給IDE做反饋的時候遇到了一些困難,甚至都用到了Nuclide。
## [Tern.js](ternjs.net/)
一個為JavaScrip設(shè)計的代碼分析引擎,也是我目前這一類中最喜歡的,它省略了編輯的步驟和注釋請求。我已經(jīng)不再使用別的類似工具,因為Tern.js自身已經(jīng)足夠好了,并且它幾乎可以毫無成本的為JS使用靜態(tài)系統(tǒng)。
## [Prompts](https://github.com/terkelg/prompts)
Prompts 是一款十分容易上手的,致力于為命令行應(yīng)用和工具創(chuàng)建漂亮的提示輸入的JS 庫。它十分輕量,所有實現(xiàn)代碼均包含在庫中,無任何外部依賴。該庫專門使用了 promise 化接口,搭配async/await使用起來更棒。
# 爬蟲
## [Headless Chrome Crawler](https://github.com/yujiosaka/headless-chrome-crawler)
這是一款用 Headless Chrome 開發(fā)的 web 爬蟲。它簡單的 API 能讓你很方便地創(chuàng)建并發(fā)、重試和延時方法。它支持深度優(yōu)先和廣度優(yōu)先爬蟲算法,支持插件式緩存存儲,例如 Redis,支持導(dǎo)出 CVS 和 JSON 格式。
## [cheerio](https://github.com/cheeriojs/cheerio)
cheerio是nodejs的抓取頁面模塊,為服務(wù)器特別定制的,快速、靈活、實施的jQuery核心實現(xiàn)。適合各種Web爬蟲程序。
# 動畫
## [Kute.js](github.com/thednp/kute.js/)
## [popmotion](https://hub.fastgit.org/popmotion/popmotion)
## [Loaders.css](https://github.com/ConnorAtherton/loaders.css)
一個有趣的純 css 加載動畫集合。它使用和自定義起來都非常簡單方便。它包含多種動畫,例如變形、旋轉(zhuǎn)、淡入等等。動畫兼容所有現(xiàn)代瀏覽器,包括 IE9+。
## [anime.js](http://animejs.com/)
Javript動畫引擎anime.js 是一個靈活的輕型JavaScript動畫庫。
它與CSS,個別變換,SVG,DOM屬性和JS對象。
## [AniJS.js](http://anijs.github.io/)
基于 CSS3 的動畫庫
## [Velocity.js](http://velocityjs.org/)
Velocity 是一個 JS 類庫,它是用來做頻繁動畫用的。Velocity 的 js 動畫“速度”是非??斓?。它比JQuery 快,甚至比 CSS 動畫還要快。Velocity 的 API 和 $.fn.animate 很像,都是通過$()來操作。velocity()是另一種方法,相比 $().animate()??偠灾?,你應(yīng)該使用一致的animate效果,包括 fadeIn 和 fadeOut 方法(譯者:Velocity 提供了 fadeIn 和 fadeOut 方法)。
## [Rocket](http://minimamente.com/example/rocket/)
當(dāng)一個元素被移動到另一個元素時,Rocket 會創(chuàng)建一個動畫。
## [bouncejs](http://bouncejs.com)
Bounce.js 是一個漂亮的關(guān)鍵幀動畫生成工具和類庫,基于 CSS3 實現(xiàn)
## [mo.js](http://mojs.io/)
挺有趣的一個動畫的圖形庫 mo.js,頁面效果真是酷炫
## [ScrollReveal.js](https://scrollrevealjs.org/)
ScrollReveal.js 用于創(chuàng)建和管理元素進(jìn)入可視區(qū)域時的動畫效果,幫助你的網(wǎng)站增加吸引力
## [gka.js](https://gka.js.org)
一款高效、高性能的幀動畫生成工具
# SVG 動畫庫
## [vivus.js](https://github.com/maxwellito/vivus/)
Vivus 是一個能動畫js類庫,它能夠給SVG圖像顯示出被畫出來的過程。Vivus是沒有其他類庫依賴的(比如jQuery)。你僅僅需要在頁面中加入這個.js文件,然后傳入需要被用來動畫的SVG部分就行。同時通過指定一些配置,它能夠在頁面加載后直接顯示動畫效果。
## [Bonsai](http://bonsaijs.org/)
Bonsai 是一個功能豐富的 JS 類庫,你能夠用它來畫和 animate 動態(tài)內(nèi)容在網(wǎng)站上。這些內(nèi)容包括了 HTML5 video、變化的 Canvas 和 SVG。通過 Bonsai 框架,你能畫一個簡單的矩形、甚至一段矩形,如果你喜歡甚至可以畫一個豐富的多人卡通游戲進(jìn)去。
## [Raphael](http://raphaeljs.com/)
RaphaelJS 也通常是用來在網(wǎng)頁上畫SVG圖和動畫的。它兼容各種windows瀏覽器一直到IE6,因為如此,Raphael成為了市面上最受信賴的js(svg)類庫。有了它,你可以制作分析圖表、地圖、游戲就像在廚房做飯一樣。
## [Snap](http://snapsvg.io/)
SnapSVG 是另一個知名 JS 類庫,它是由 Dmitry Baranovskiy 開發(fā)的(Raphael 同樣也是)。同樣它也是 Adobe Web Software Group 來維護(hù)。和 Raphael 不同的是,它只提供了 ie 最新版支持。這使得 SnapSVG 在體積上小了許多(相比 Raphel)以實現(xiàn)相同的功能(比如 trim)和支持最新的功能。
## [SVG.js](http://svgjs.com/)
SVG.js 是一個輕量級的操作和動畫 SVG 類庫。你能夠操作變化方向、位置和顏色。這還沒完,你甚至可以自己實現(xiàn)插件等一些其他功能。這個實例可以attach一些插件,比如svg.filter.js,他可以為你的圖片實現(xiàn) Gaussian blur, desaturase, compare, sepia 等等功能。
## [Chartlist.js](http://gionkunz.github.io/chartist-js/)
Chartist.js 是一個簡單的容易被接受的圖標(biāo)庫,它是通過SVG繪制的。Chartist的宗旨是提供一個簡單的,輕量級的,非侵入式的圖表庫。你需要提供一些javascript配置對象做一些自定義配置,要不然它會使用默認(rèn)的配置,即已經(jīng)默認(rèn)是排序過后的。
Chartist是通過 inline-SVG繪制的,所以它對DOM操作影響很小,相對于它提供的功能來說。而且意味著Chartist不會提供個人控制、水印、行為等等一些你能夠通過簡單的HTML, JavaScript and CSS實現(xiàn)的。
## [Walkway](https://github.com/ConnorAtherton/walkway)
Walkway 支持3種方式, path, line 和 用polyline來畫的svg線。它提供了一個很好的例子,繪制了一個PlayStation 的集合動畫。
# 視覺差
## [parallax.js](http://matthew.wagerfield.com/parallax/)
Parallax.js 是一款功能非常強(qiáng)大的 JavaScript 視覺差特效引擎插件。通過這個視覺差插件可以制作出非常炫酷的視覺差特效,可以檢測智能設(shè)備的方向。
## [BasicScroll](https://github.com/electerious/basicScroll)
這款插件讓你能在你的設(shè)計中添加視差滾動動效。你可以直接在 CSS 中使用相應(yīng)的變量或?qū)傩裕蛘咴?JS 中使用以獲得更好的動畫效果。它運行起來非常順滑,而且沒有任何框架依賴,能很好地應(yīng)用在桌面和移動設(shè)備上,并且支持觸控事件。
# 跨平臺的桌面應(yīng)用
## [proton-native](https://github.com/kusti8/proton-native)
proton-native 是一個結(jié)合了 node, libui, react 的一個產(chǎn)物,使用 node 的環(huán)境, react 的語法和 libui 的跨平臺調(diào)用 ui 控件的能力。proton-native 可用于構(gòu)建跨平臺的桌面應(yīng)用,構(gòu)建方式簡單,構(gòu)建的包輕量。
## [Electron](https://github.com/electron/electron)
Electron是一款利用Web技術(shù)開發(fā)跨平臺桌面應(yīng)用的框架。electron 相對來說比 nw.js 靠譜。
## [react-native-macos](https://github.com/ptmt/react-native-macos)
React Native for macOS是使用Cocoa編寫桌面應(yīng)用程序的實驗性工具
# 轉(zhuǎn)譯器
## jsweet
http://www.jsweet.org/
A transpiler from Java to TypeScript/JavaScript
- 步入JavaScript的世界
- 二進(jìn)制運算
- JavaScript 的版本是怎么回事?
- JavaScript和DOM的產(chǎn)生與發(fā)展
- DOM事件處理
- js的并行加載與順序執(zhí)行
- 正則表達(dá)式
- 當(dāng)遇上this時
- Javascript中apply、call、bind
- JavaScript的編譯過程與運行機(jī)制
- 執(zhí)行上下文(Execution Context)
- javascript 作用域
- 分組中的函數(shù)表達(dá)式
- JS之constructor屬性
- Javascript 按位取反運算符 (~)
- EvenLoop 事件循環(huán)
- 異步編程
- JavaScript的九個思維導(dǎo)圖
- JavaScript奇淫技巧
- JavaScript:shim和polyfill
- ===值得關(guān)注的庫===
- ==文章==
- JavaScript框架
- Angular 1.x
- 啟動引導(dǎo)過程
- $scope作用域
- $q與promise
- ngRoute 和 ui-router
- 雙向數(shù)據(jù)綁定
- 規(guī)范和性能優(yōu)化
- 自定義指令
- Angular 事件
- lodash
- Test
