最熱web前端技術精粹

Web前段技術發展很快，主流技術突飛猛進，想一想本身剛畢業那會用的asp技術，如今已經不多有主流網站在使用了。再到後來的J2EE框架，而後SpringMVC大行其道，可是最近各類js框架被廣爲傳播，Html5的推出非常豐富了移動互聯網的發展，此文對當前最 新的幾種web前端技術進行的彙總，讓你們更多地瞭解，而後取其所長，避其所短，快速推出簡約大方，維護方便，性能良好的我的網站。

JavaScript MV*框架

在至關長的一段時間裏，每一個程序員都要學會如何利用JavaScript來編寫彈出一個警告框或查看是否包含@符號的電子郵件之類的程序。而現如 今，HTML AJAX App變得複雜了，以致於不多有人從頭開始來學習它們。相反，像使用一個精心設計的框架、編寫一些粘合代碼來實現業務邏輯的方式更容易讓人們接受。這些框 架均可以幫助你處理Web App和網頁上的事件和內容，大大的節省了時間。
相似的框架如： Dojo Utility tool,jQuery,AngularJS,Backbone.js,Node.js等等，

* AngularJS
AngularJS是一款開源 JavaScript函式庫，由Google維護，用來協助單一頁面應用程式運行的。它的目標是透過MVC模式 (MVC) 功能加強基於瀏覽器的應用，使開發和測試變得更加容易。

函式庫讀取包含附加自定義（標籤屬性）的HTML， 聽從這些自定義屬性中的指令，並將頁面中的輸入或輸出與由JavaScript變量表示的模型綁定起來。這些JavaScript變量的值能夠手工設置，或者從靜態或動態JSON資源中獲取。

* Backbone.js
Backbone.js是一套JavaScript框架與RESTful JSON的應用程式接口。也是一套大體上符合MVC架構的編程範型。Backbone.js以輕量爲特點，只需依賴一套Javascript 函式庫便可運行。常被用來開發單頁的互聯網應用程式，以及用來維護網絡應用程式的各類部份（例如多使用者與服務器端）的同步。Backbone.js是由 Jeremy Ashkenas所開發，他同時也是CoffeeScript的開發者。

* jQuery
jQuery是一套跨瀏覽器的JavaScript庫，簡化HTML與JavaScript之間的操做。由John Resig在2006年1月的BarCamp NYC上發佈第一個版本。目前是由 Dave Methvin 領導的開發團隊進行開發。全球前10000個訪問最高的網站中，有65%使用了jQuery，是目前最受歡迎的JavaScript庫.

* Dojo utility tool
Dojo是一個用javascript語言實現的開源DHTML工具包。它是在幾個項目捐助基礎上創建起來的 (nWidgets,Burstlib,f(m)),這也是爲何叫它a"unified"toolkit的緣由。Dojo的目標是解決開發DHTML應 用程序遇到的那些，長期存在、歷史問題(historical problems with DHTML)。跨瀏覽器問題。

 

*Avalon

司徒正美的巔峯框架

 

HTML5框架

Bootstrap或者Foundation, Pure， semantic-ui


CSS框架

曾幾什麼時候，只要是在Web頁面花點時間就能打開CSS文件，還包括一個新的命令，像font-style:italic，接下來只須要利用一上午的時間就能把全部事情搞定。而如今的網頁設計則相對複雜些，並且也不可能利用這麼簡單的命令就能夠填補一個文件。

能夠這麼說，CSS框架是SASS和Compass最堅實、最牢固的基礎，CSS框架可以提供相似於實際變量、嵌套模塊和混合之類的組件，這樣有助於建立高質量、更穩定的編碼程序。這聽起來並不像是編程領域裏的新奇事物，可是這在設計領域裏幾乎是一個巨大的飛躍。

CSS框架通常是CSS文件的集合，包括基本風格的字體排版，表單樣式，表格佈局等等，好比：
    * typography.css 字體排版規則
    * grid.css 表格佈局
    * layout.css 佈局
    * form.css 表單
    * general.css CSS常規設置
下面是一些不錯的CSS框架。詳細參閱：CSS框架


* Elements CSS Frameworks
Elements 是一個基礎CSS框架，它用來幫助設計者書寫CSS更加快捷簡單。它不只是一個框架，它擁有本身的工做流。它擁有你須要完成項目的各類元素，查看介紹：Overview .

* YUI Grids CSS

基礎的YUI Grids CSS提供4種頁面寬度，6種邊框模板，以及控制行列能力。4kb文件提供了超過1000個頁面佈局等。

* YAML CSS Framework

Dirk Jesse的可以對(X)HTML/CSS 框架擴展，支持複雜web項目。YAML基於web標準和支持各類流行瀏覽器，尤爲支持全部IE版本包括從 5.x/Win 到 7.0.

* Blueprint CSS

Blueprint是一個CSS框架，它的目標是減小你的CSS開發時間。它提供給你強大的CSS基礎來建立你的項目，包括易於使用的grid，有效的字體排版，以及可打印的stylesheet.

 

 

SVG+JavaScript on Canvas
曾幾什麼時候Flash一直在牽引着軟件工程師們的主流思想，主要是由於軟件工程師樂見這樣的結果。對普通顯示效果的渲染看起來很不錯，許多有才華的設計師們爲Flash代碼創建了一個優質的堆棧，這樣便於提供複雜的轉換和動畫顯示功能。

既然JavaScript有能力作和Flash一樣的事情，那瀏覽器廠商和開發者確定更加傾向於JavaScript。開發者們認爲DOM層與來自新格式 SVG（可伸縮向量圖形）的整合將會帶來更好的結果。SVG和HTML是由大量的標籤組成，便於Web開發者使用。緊接着，就會有大量的API在 Canvas項目上提供精緻的畫面，弱弱的問一句：那還有必要再繼續使用Flash嗎？

單頁面Web App設計

記得在網絡出現並不久的時候，URL所指向的Web頁面都是充滿了靜態文本和圖像的，把全部信息放到一個稱之爲網絡的網頁是很是之簡單的。新的Web App對於大型數據庫而言算是比較前端的了，當Web App想要得到所需信息的時候，它就會從數據庫中把數據調出來放到指定的位置，而數據層則是徹底獨立於表示層和格式化層的。在這裏，移動計算機處理技術的 興起也是另外一個因素：一個單一的、響應式設計的Web頁面就像是一個應用程序——這樣就更好的避免了APP Store裏可能出現的混亂現象。

Web接口

也是在很早之前，人們只能使用一個命令行編譯器。後來呢，有人經過集成編輯器和其餘工具而建立了IDE。不過如今又到了IDE黯然失色的時候了——經過基 於瀏覽器的工具就能夠編寫用於工做系統的代碼。若是你不喜歡WordPress的工做方式，IDE能夠在程序中安裝一個內置的編輯器，隨時隨地的更改代 碼，也就是說，IDE更人性化。國內首家基於web編譯器功能的網站（www.gbtags.com）更是引發了廣大web前端開發者的關注。

Node.js
Node.js是一個事件驅動I/O服務端JavaScript環境，基於Google的V8引擎。目的是爲了提供撰寫可擴充網絡程序，如Web服務。第一個版本由Ryan Dahl於2009年發佈，後來，Joyent僱用了Dahl，並協助發展Node.js。

其餘編程語言的相似開發環境，包含Twisted於Python，Perl Object Environment於Perl，libevent於C，和EventMachine於Ruby。與通常JavaScript不一樣的地 方，Node.js並非在Web瀏覽器上運行，而是一種在服務器上運行的Javascript服務端JavaScript。
Node.js實現了部份CommonJS規格（Spec）。Node.js包含了一個交互測試REPL環境。

在Node.js領域裏，Node.js在瀏覽器和服務器之間提供和諧的開發環境以得到利益。運行在瀏覽器和服務器之間相同的代碼使得開發者在調用功能和複製特性的時候及其便利。最後，Node.js層將會成爲互聯網上最熱門的堆棧。