### 閑話js前端框架 前端人員=美工+設計+代碼+測試 ——題記 **專題文章：** 一、從avalonjs的模板說起 二、龐大的angularjs 三、再也不想碰DOM 四、組件化？有沒有后端的事？ 五、再看自己一年前設計的微型渲染引擎 六、在瀏覽器標準上做文章 七、拋開瀏覽器，構建應用容器 八、為何Flash、銀光和Java都在網頁端一蹶不振 本文屬 西風逍遙游 原創, 轉載請注明出處: 西風世界 [http://blog.csdn.net/xfxyy_sxfancy](http://blog.csdn.net/xfxyy_sxfancy) ### 六、在瀏覽器標準上做文章 為了簡化前端的開發，或做一些特殊的應用，我們往往需要采取某些‘非人道’的方式，才能實現某些功能。例如下面這個js庫，就是為了兼容各個瀏覽器標準，那么就做了這樣一件匪夷所思的事： lua.vm.js——一個跑在js上的lua虛擬機 對你沒聽錯，這是一個虛擬機！ ### 虛擬機的歷史 虛擬機有簡有繁，并不是所有的虛擬機都像java虛擬機那么恐怖。談起虛擬機的歷史，那可是十分的悠久。在1965年前后，IBM的研究人員試圖去測量一些計算機科學領域新概念的實際效果。他們設計了一種方案，需要把機器分割成“更小的部件”。這些部件要求能夠管理他們自己的資源，以使得研究人員能夠在同一時間在系統中測試測試許多不同的條件，而不用改變系統的其他“部件”。他們相信， 對于這個實驗來講，一個虛擬機的實現會工作的非常好。 于是，他們就真的將這個設計實現了出來，并且做成了一款成功的產品，一個多用戶環境的操作系統來出售。這套虛擬機系統現在被稱做IBM370系統（S/370）和IBM390系統（S/390）。 ### js上實現虛擬機的困難之處 其實本質上，lua的虛擬機并不是特別復雜，我們會發現，lua的棧式虛擬機實際上非常簡短。但問題是，原來的C實現，現在改成js實現，有一個最大的困難是，js也是運行在虛擬機上的。 這會引入什么問題呢？例如跨虛擬機的循環回收，js里面有一個對象被lua對象保存，而恰好，這個lua對象又被這個js對象保存，那么好，如果只是一個虛擬機下，當然很容易就做到，但兩個虛擬機的實現時，就幾乎成了不可完成的任務。C語言由于是自己控制內存的申請和釋放，所以被其他地址引用并不會有什么問題。但js的自動內存管理反而復雜化了這個問題。 ### js混合lua代碼的運行 感覺很特別，用lua的風格去操作網頁，確實很有趣！ ~~~ print('hello' .. ' ' .. 'world!') – 這是Lua！ print(js.run('[0,1,2,3,4,5][3]')) – 在Lua中運行JS -- 使用Lua與頁面交互 local screen = js.global.screen print("you haz " .. (screen.width*screen.height) .. " pixels") local window = js.global -- window是JS中的global對象 window.alert("hello from lua!") window.setTimeout(function() print('hello from lua callback') end, 2500) local document = js.global.document print("this window has title '" .. document.title .. "'") ~~~ ### asm.js lua.vm.js也不是憑空出現的，他依賴一個強大的底層庫，asm.js asm.js是一個JavaScript的一個嚴格的子集，可以被用來作為一個底層的、高效的編譯器目標語言。asm.js提供了一個類似于C/C++虛擬機的抽象實現，包括一個可有效負載和存儲的大型二進制堆、整型和浮點運算、高階函數定義、函數指針等。 簡單來說asm.js是用js寫的一個基本庫，用來模擬計算機底層的數據類型和結構。安裝asm.js的工作方式，能夠模擬C++等靜態類型語言的底層運行環境。 這樣做有什么意義呢？ 去年，Mozilla和Epic聲明他們已經為Asm.js支持Unreal Engine 3——并且運行十分良好。 他們將C++的游戲引擎，編譯成了javascript，然后使用WebGL進行渲染。  由于對asm.js進行單獨處理，它的性能已經非常好了，對于復雜的應用（比如上面的游戲）性能僅僅比普通C++編譯的慢兩倍（可以和Java或者C#相媲美）。實際上，這已經比目前瀏覽器的運行時環境要快很多了，幾乎是最新版的Firefox或者Chrome執行速度的4~10倍。