阿里的weex框架到底是什么

---

title: 阿里的weex框架到底是什么
date: 2016-09-27 10:22:34
tags: vue, weex
category: 技術總結

weex 工作原理

首先看下官方的說法：transformer 會把 template, style, script 都轉換成一段段 json 或者 js，這樣客戶端只接收並運行js，不必同時解析html/css這些語法，並且這些js還會繼續進行數據監聽和綁定，然后生成最終的virtual dom 再發送給 native端進行渲染。

weex 主要就是做了三件事

1. 在服務端用 Transformer 工具把 Vue 代碼轉換成 Js Bundle。
2. 在客戶端運行Js Framework 的 JavaScript 引擎，解釋執行Js Bundle生成Virtual DOM。
3. 在客戶端設計一套 JS Bridge，能使IOS端（或者Android端）的Object-C語言（或Java語言）與Javascript語言相互調用，把Virtual Dom轉換為DOM，渲染到頁面。H5端直接和Js Framework 通訊，不需要Js Bridge。
   如下為Virtual DOM 渲染為Dom的過程：
   

相關概念：

• ECMAScript：定義了JavaScript語言的標准
• JavaScriptCore：應用在在wekit內核內的js引擎，瀏覽器有Safari。
• V8: 應用在chromium內的js引擎，瀏覽器有Chrome。
• JS引擎的作用都是解釋和執行JavaScript代碼。
• 有關JavaScript引擎解析的內容請查看 JavaScriptCore解析
• 有關JavaScriptCore和V8的內容請查看：JavaScript引擎

怎么開始搭建個weex項目

相對比較簡單看官方吧。

weex相關工具

• node.js
• weex-toolkit
• Weex Playground App

相關論壇

• weex 文章
• weex 調試
• weex 文檔：
• weex中使用數據流工具Vuex實踐
• weex交流室