數據驅動的高交互可視化圖形語法 AntV - G2

G2 是一套基于可視化編碼的圖形語法，以數據驅動，具有高度的易用性和擴展性，用戶無需關注各種繁瑣的實現細節，一條語句即可構建出各種各樣的可交互的統計圖表。

同時，G2 也是 AntV 最重要的組成，始于《The Grammar of Graphics》一書描述的視覺編碼語法系統（這也是 G2 項目命名的由來）。

項目地址：https://github.com/antvis/g2

企業級中后臺 UI 解決方案 Fusion Design

Fusion Design 是一套企業級中后臺UI的解決方案，致力于解決設計師與前端在工作協同、產品體驗一致性、開發效率方面的問題。

你可以通過一站式協作平臺靈活地定制自己的 DesignSystem，生成設計物料與代碼分片到設計師的工具端 FusionCool 及開發者的工具端 Iceworks，同時保證代碼和視覺稿之間的一致性。

@alifd/next 配合 Fusion Design 解決在頁面開發時設計師和前端協同的問題。通過這套體系設計師可以自由的定制組件的 UI 并產出一個 npm 主題包，前端可以直接使用這個主題包不需要關注組件的還原度問題。省去了和設計師反復的去做還原度 Review 的工作量，大幅度的提高了開發效率。

項目地址：https://fusion.design/

設計語言 & 前端框架 Ant Design

Ant Design 是螞蟻金服開發和正在使用的一套企業級的前端設計語言和基于 React 的前端框架實現。它的特性：企業級金融產品的交互語言和視覺體系；豐富實用的 React UI 組件；基于 React 的組件化開發模式；背靠 npm 生態圈；基于 webpack 的調試構建方案，支持 ES6。

• 提煉自企業級中后臺產品的交互語言和視覺風格。
• 開箱即用的高質量 React 組件。
• 使用 TypeScript 構建，提供完整的類型定義文件。
• 全鏈路開發和設計工具體系。

地址：https://github.com/ant-design/ant-design

基于 G2 封裝的 React 圖表庫 BizCharts

BizCharts 是一個基于 G2 封裝的 React 圖表庫，具有 G2、React 的全部優點，可以讓用戶以組件的形式組合出無數種圖表；并且集成了大量的統計工具，支持多種坐標系繪制，交互定制，動畫定制以及圖形定制等等。相信 BizCharts 定能成為您的數據可視化項目的強力助手。

地址：https://github.com/alibaba/BizCharts

企業級 Node.js 框架 Egg

阿里開源的企業級 Node.js 框架。Egg.js 的插件機制有很高的可擴展性，一個插件只做一件事。Egg.js 通過框架聚合這些插件，并根據自己的業務場景定制配置，這樣應用的開發成本就變得很低。

Egg 奉行『約定優于配置』，按照一套統一的約定進行應用開發，團隊內部采用這種方式可以減少開發人員的學習成本，開發人員不再是『釘子』，可以流動起來。沒有約定的團隊，溝通成本是非常高的，比如有人會按目錄分棧而其他人按目錄分功能，開發者認知不一致很容易犯錯。但約定不等于擴展性差，相反 Egg 有很高的擴展性，可以按照團隊的約定定制框架。使用 Loader 可以讓框架根據不同環境定義默認配置，還可以覆蓋 Egg 的默認約定。

地址：https://github.com/eggjs/egg

基于 React 的前端框架 umi

umi，中文可發音為烏米，是一個可插拔的企業級 react 應用框架。umi 以路由為基礎的，支持類 next.js 的約定式路由，以及各種進階的路由功能，并以此進行功能擴展，比如支持路由級的按需加載。然后配以完善的插件體系，覆蓋從源碼到構建產物的每個生命周期，支持各種功能擴展和業務需求，目前內外部加起來已有 50+ 的插件。

umi 是螞蟻金服的底層前端框架，已直接或間接地服務了 600+ 應用，包括 java、node、H5 無線、離線（Hybrid）應用、純前端 assets 應用、CMS 應用等。他已經很好地服務了我們的內部用戶，同時希望他也能服務好外部用戶。

地址：https://github.com/umijs/umi

前端構建和工程化工具 Dawn

Dawn 取「黎明、破曉」之意，原為「阿里云·業務運營團隊」內部的前端構建和工程化工具，現已完全開源。它通過 pipeline 和 middleware 將開發過程抽象為相對固定的階段和有限的操作，簡化并統一了開發人員的日常構建與開發相關的工作。

特點

• 采用中間件技術，封裝常用功能，易于擴展，方便重用
• 支持 pipeline 讓多個 task 協同完成構建任務
• 簡單、一致的命令行接口，易于開發人員使用
• 支持基于「中心服務」管理中間件和工程模板
• 支持搭建私有中心服務，并統一下發構建規則，易于團隊統一管理

地址：https://alibaba.github.io/dawn/

頁面邏輯原型 Ant UX

Ant UX 是一套制作頁面邏輯的素材庫，當你在產品設計初期，可以用它來繪制頁面與頁面之間的邏輯圖，幫助你了解產品架構，業務流程

配合工具: OmniGraffle ,Sketch

• OmniGraffle 可以用來繪制圖表，流程圖，組織結構圖以及插圖，也可以用來組織頭腦中思考的信息，組織頭腦風暴的結果，繪制心智圖，作為樣式管理器，或設計網頁或PDF文檔的原型。它具有采用拖放的所見即所得界面。所謂的 "Stencils" 一組用于拖放的形狀—可以作為 OmniGraffle 的插件使用，用戶也可以創建自定義的 Stencils。
• Sketch 是一個矢量設計軟件，可以幫助你快速投入UI設計當中

地址：http://ux.ant.design/

跨容器的渲染引擎 Rax

Rax 是一個全新的思路。它是一個通用的跨容器的渲染引擎， 如果你使用過 React ， 那么你就已經知道了該如何使用 Rax ， 因為它們的 API 是完全兼容的。

Rax 的誕生，主要還是為阿里巴巴廣泛的業務來服務的。現在，我們讓它走向開源，服務更多的開發者。

還記得 React Native 的口號：

Learn once, write anywhere.

但對于我們來說，或許這還不夠。真正的釋放我們的勞動力，才是 Rax 要做的事情。 Rax 旨在

Write once, run everywhere.

我們只要開發一次，便不用再擔心各個平臺的兼容。

地址：https://alibaba.github.io/rax/

基于 WebGL 的 Javascript 3D 繪圖引擎 G3D

G3D 是一款基于 WebGL 的 javascript 3D 繪圖引擎。與其他的 WebGL 3D 引擎相比，G3D 是更加「純粹」的渲染引擎，也就是說，它完全不依賴任何 DOM API，而是僅僅依賴一個 canvas 對象（或者類 canvas 對象）。該特性使得 G3D 不僅能夠運行在瀏覽器環境中，也能夠運行在一些非瀏覽器的 js 終端環境下（hybrid 環境），比如 GCanvas 環境（基于 Weex 或 ReactNative）。

地址：https://alibaba.github.io/G3D/

跨平臺移動開發工具 Weex

Weex 致力于使開發者能基于當代先進的 Web 開發技術，使用同一套代碼來構建 Android、iOS 和 Web 應用。具體來講，在集成了 WeexSDK 之后，你可以使用 JavaScript 和現代流行的前端框架來開發移動應用。

Weex 的結構是解耦的，渲染引擎與語法層是分開的，也不依賴任何特定的前端框架，目前主要支持 Vue.js 和 Rax 這兩個前端框架。

Weex 的另一個主要目標是跟進當代先進的 Web 開發和原生開發的技術，使生產力和性能共存。在開發 Weex 頁面就像開發普通網頁一樣；在渲染 Weex 頁面時和渲染原生頁面一樣。

地址：https://github.com/apache/incubator-weex/

基于 Weex 的 UI 組件庫 Weex UI

Weex UI 是一個基于 Weex 的富交互、輕量級、高性能的 UI 組件庫

地址：https://github.com/alibaba/weex-ui

動效語言& React 框架動效解決方案 Ant Motion

Ant Motion 是從螞蟻金服的 Ant Design 中提煉出來的動效語言。它不僅僅是動效語言，同時也是一套 React 框架動效解決方案，提供了單項，組合動畫，以及整套解決方案，幫助開發者更容易的在項目中使用動效。

• 增加體驗舒適度： 讓用戶認知過程更為自然。
• 增加界面活力：第一時間吸引注意力，突出重點。
• 描述層級關系：體現元素之間的層級與空間關系。
• 提供反饋、明確意向：助力交互體驗。

地址：https://motion.ant.design/index-cn

多頁面切換場景統一解決方案 UltraViewPager

UltraViewPager 是阿里開源的一個封裝多種特性的 ViewPager ，主要是為多頁面切換場景提供統一解決方案。

UltraViewPager繼承自RelativeLayout，將ViewPager和indicator置于其中，同時UltraViewPager提供了一些ViewPager常用方法的代理，這樣在日常使用上保持和ViewPager無差異，如果需要調用ViewPager的所有方法，可通過getViewPager()方法拿到真正的ViewPager進行操作。

豎向滑動是通過在ViewPager的onInterceptTouchEvent和onTouchEvent中交換橫豎向的event location，同時設置特殊PageTransformer實現，詳見源碼。

地址：https://github.com/alibaba/UltraViewPager

模塊化 UI 界面方案 Tangram UI

Tangram，七巧板，幾塊簡單的積木就能拼出大千世界。我們用Tangram來命名這套界面方案，也是希望他能像七巧板一樣可以通過幾塊積木就搭出豐富多彩的界面。

特性：

• 跨平臺支持：已有Android&iOS支持，一份數據，多端渲染一致
• 面向業務：流式布局，瀑布流布局，吸頂，浮標，輪播，內置布局可適應大多數場景，開放的API，易于拓展自己的布局和解析器
• 高性能：高效的回收復用算法，可定制化的復用粒，適應復雜布局的場景，為絲滑般順暢提供基礎
• 動態組件：通過 VirtualView，支持自定義 XML 動態創建組件視圖
• TAC：配套的后端微服務設施，靈活構建 Tangram 業務所需的數據

地址：http://tangram.pingguohe.net/

自動化測試解決方案 Macaca

Macaca 是一套面向用戶端軟件的測試解決方案，提供了自動化驅動，環境配套，周邊工具，集成方案，旨在解決終端上的測試、自動化、性能等方面的問題。

其有如下特點：

• 跨平臺：支持在移動端和PC端的Native, Hybrid, 移動端Web應用
• 支持真機：支持真機和模擬器，以及大量樣板示例
• 更加容易：支持多種語言棧編寫腳本，提供調試，元素查看器，數據Mock，錄制回放等周邊
• 提供CI方案：提供持續集成方案及持續集成平臺的私有部署方案

地址：https://github.com/alibaba/macaca

基于 React 的中后臺應用解決方案 飛冰 ICE

飛冰(ICE) 是一套基于 React 的中后臺應用解決方案，ICE 包含了一條從設計端到開發端的完整鏈路，幫助用戶快速搭建屬于自己的中后臺應用。

面向設計者端，ICE 提供了 ICE Design 設計語言，來給 UI 界面提供專業的視覺指導。面向開發者端，ICE 提供了 Iceworks 工具，這是一個圖形化界面的開發平臺，它承載了 ICE 的物料體系和開發體驗。

地址：https://alibaba.github.io/ice/

HTML5 互動游戲引擎 Hilo

Hilo 是阿里巴巴集團開發的一款HTML5跨終端游戲解決方案，ta可以幫助開發者快速創建HTML5游戲。

主要特性

• Hilo 支持多種模塊范式的包裝版本，包括AMD，CMD，COMMONJS，Standalone多種方式接入。另外，你可以根據需要新增和擴展模塊和類型；
• 極精簡的模塊設計，完全面向對象；
• 多種渲染方式, 提供DOM，Canvas，Flash，WebGL等多種渲染方案（目前已經申請專利）；
• 全端瀏覽器的支持和高性能方案，獨有的Flash渲染方案，即使在低版本IE瀏覽器下也可以跑起來“酷炫”游戲； DOM渲染方案能顯著解決低性能手機瀏覽器遇到的性能問題；
• 物理引擎支持——Chipmunk，支持自擴展物理實現；骨骼動畫支持——DragonBones，同時內建骨骼動畫系統——Tahiti（目前內部使用）；
• 案例豐富，框架成熟，已經經歷多屆阿里巴巴雙十一，年中大促互動營銷活動考驗；

地址：https://github.com/hiloteam/Hilo

JavaScript 模板引擎 Velocity.js

Velocity.js 是 velocity 模板語法的 JS 版本實現。Velocity 是基于Java 的模板引擎，廣泛應用在阿里體系的各個子公司項目。Velocity 模板適用于存在大量模板使用的場景，支持各種復雜的邏輯運算，包含 基本數據類型、變量賦值和函數等功能。Velocity.js 支持 Node.js 和 瀏覽器環境。

地址：https://github.com/shepherdwind/velocity.js

非侵入式運行期 AOP 框架 Dexposed

Dexposed 是一個功能強大但非侵入性的運行時 AOP（面向方面編程）框架，用于 Android 應用程序開發，基于ROOT 社區著名開源的 Xposed 框架項目的工作。其改造剝離了 ROOT 部分，演化為服務于所在應用自身的 AOP 框架。它支撐了阿里大部分 App 的在線客戶端 BugFix 和線上調試的能力。

地址：https://github.com/alibaba/dexposed

自動化測試解決方案 UI Recorder

UI Recorder 是一款零成本的整體自動化測試解決方案，一次自測等于多次測試，測一個瀏覽器等于測多個瀏覽器！

地址：https://github.com/alibaba/uirecorder

Android 應用熱修復工具 AndFix

AndFix 是阿里巴巴開源的一個為 Android 應用提供熱修復工具，幫助 Anroid 開發者能夠及時修復應用的線上問題。Andfix 是 "Android hot-fix" 的縮寫。

地址：https://github.com/alibaba/AndFix

基于 Node.js 的自動化持續集成 Reliable

Reliable 是分布式架構的持續集成系統，由Macaca 團隊的成員開發。適用于集成構建、集成構建等場景。她是典型的主從結構，分為reliable-master 與 reliable-slave 兩部分。

地址：https://github.com/macacajs/reliable

模擬數據生成器 Mock.js

Mock.js 是阿里巴巴開源的一款模擬數據生成器，旨在幫助前端工程師獨立于后端進行開發，幫助編寫單元測試。提供了以下模擬功能：

• 根據數據模板生成模擬數據
• 模擬 Ajax 請求，生成并返回模擬數據
• 基于 HTML 模板生成模擬數據。

地址：https://github.com/nuysoft/Mock

React 應用的服務器渲染框架 Beidou

Beidou(北斗) 是阿里巴巴開源的一個 NodeJS & React 同構框架，基于Egg.js開發。

功能/特性

• ?? 高性能, 相比客戶端渲染 2-5 倍性能提升
• ?? 搜索引擎友好(SEO)
• ?? 支持 ES6/ES7/ES8 JavaScript 語法
• ?? 支持 TypeScript
• ?? 支持 SCSS/Sass
• ?? 支持自動路由
• ?? 提供擴展默認 webpack 配置的接口
• ?? 可自定義視圖渲染中間件
• ?? 易使用的 CLI 工具
• ?? 可拔插的同構能力

地址：https://github.com/alibaba/beidou