狠狠色丁香婷婷综合尤物/久久精品综合一区二区三区/中国有色金属学报/国产日韩欧美在线观看 - 国产一区二区三区四区五区tv

LOGO OA教程 ERP教程 模切知識交流 PMS教程 CRM教程 開發文檔 其他文檔  
 
網站管理員

Web前端技術歷經洗禮和蛻變

admin
2014年9月5日 6:56 本文熱度 3833
  隨著互聯網產業的爆炸式增長,與之伴生的 Web 前端技術也在歷經洗禮和蛻變。尤其是近幾年隨著移動終端的發展,越來越多的人開始投身或轉行至新領域,這更為當今的 IT 產業注入了新的活力。盡管 Web 前端技術誕生至今時日并不長,但隨著 Web 技術的逐漸深入,今后將會在以下幾方面發力。
  1.Web 移動終端開發。
  2.JavaScript 的兄弟們。
  3. 百花齊放的類庫和框架。
  4. 工程化的 Web 前端開發規范。
  Web 移動終端開發
  PhoneGap:一個開源的開發框架,使用 HTML、CSS 和 JavaScript 來構建跨平臺的移動應用程序。它使開發者能夠利用 iPhone、Android、Palm、Symbian、BlackBerry、WindowsPhone 和 Bada 等智能手機的核心功能,包括地理定位、加速器、聯系人、聲音和振動等。除了在本地編譯應用之外,還可以使用 PhoneGap 提供的云端 Build 工具進行應用編譯。也就是說,只需要將用 HTML5 寫好的應用上傳到 PhoneGap 的云端服務器,PhoneGapBuild 即可將其編譯成適合不同平臺的應用。
  前端知識圖譜 
  SenchaTouch:說到這里,就不得不提一些面向移動端的 WebUI 庫,畢竟 PhoneGap 是一個工具,要想基于 Web 技術構建完整的 App,必須選擇一些適用的移動 UI 庫。而最值得一提的是 SenchaTouch,它可以讓 WebApp 看起來像 NativeApp。美麗的用戶界面組件和豐富的數據管理,全部基于最新的 HTML5 和 CSS3 的 Web 標準,全面兼容 Android 和 iOS 設備。PhoneGap 昭示著一種開發趨勢,即 App 也可以使用 Web 前端技術來完成。而作為開發者最常用的 UI 工具箱,SenchaTouch 又進一步加速了這種趨勢,目前在淘寶已有大量的項目采用這種思路來搭建,即在內置應用的外殼加上自定義的基于移動 Web 的 UI 庫。相信在未來這種模式必會越來越流行。
  MediaQueries:在 CSS2 時代,如果你曾經為網站設計過打印版 CSS,那么就會明白 CSS3MediaQueries 的作用。不過,CSS3 的 MediaQueries 比 CSS2 的 Media
  Type 更實用,因為 CSS2 的 MediaType 并不曾被多少設備支持過。CSS3 的 Media
  Queries 可以獲取這些數據:瀏覽器窗口的寬和高、設備的寬和高、設備的手持方向(橫向還是豎向)和分辨率等。也就是說,MediaQueries 提供了一種基于不同的平臺寫 CSS 的技術。這項技術在 2011 年初被推廣開來,至今已非常火熱,尤其是在 Web 頁面仍占互聯網流量大多數的今天,這種兼容技術能很快讓網站兼容移動設備,保證產品實現最快的跨平臺的兼容性和多平臺的可用性。
  Zepto.js:一個專為 MobileWebKit 瀏覽器(如 Safari 和 Chrome)而開發的 JavaScript 框架。它標榜自己簡約的開發理念能夠幫助開發人員簡單、快速地完成開發交付任務。更重要的是這個 JavaScript 框架是超輕量級的,只有 5KB。Zepto.js 的語法借鑒且兼容 jQuery。目前已有不少網站開始基于 Zepto.js 做應用,因為在拋棄了 IE 瀏覽器的兼容性問題后,Web 開發會變得越來越純粹,體積更輕巧,編碼也更加愉悅。不可否認,隨著移動終端開發越來越流行,Zepto.js 在未來將會有更加廣闊的應用場景和空間。
  Bootstrap:Twitter 推出的一個開源的用于前端開發的工具包。它由 MarkOtto 和 JacobThornton 合作開發,是一個 CSS/HTML 框架。Bootstrap 提供了優雅的 HTML 和 CSS 規范,由動態 CSS 語言 LESS 寫成,與 CSS 框架 Blueprint 存在很多相似之處。Bootstrap 一經推出便頗受歡迎,一直是 GitHub 上的熱門開源項目,NASA 和 MSNBC 的 BreakingNews 都使用了該項目。2012 年第二季度,Bootstrap 發布了 2.0 版,Bootstrap2.0 的一個重大改進是添加了響應設計特性,在 1.0 中,這是讓很多開發人員抱怨的地方。而且為了提供更好的針對移動設備的響應式設計方案,Bootstrap2.0 采用了更為靈活的 12 欄網格布局。此外,它還更新了一些進度欄及可定制的圖片縮略圖,并增加了一些新樣式。值得關注的是,Bootstrap 是一個非常輕量級的框架,2.0 在壓縮后只有 10KB。Bootstrap 為我們的網站快速搭建提供了不錯的工具和思路,這個工具集將擁有更旺盛的生命力。
  JavaScript 的兄弟們
  CoffeeScript 是一個借鑒 Ruby 編寫的新編程語言,創建者 JeremyAshkenas 戲稱它是 JavaScript 的低調的小兄弟,因為 CoffeeScript 會將 Ruby 編譯成 JavaScript,而且大部分結構都相似。但不同的是,CoffeeScript 擁有更嚴格的語法。它的最大功績就是將 JavaScript 硬綁的 C/Java 語法拋棄了,改為采用類似 Ruby/Python 的語法。Ruby/Python 本來就是深受 Lisp 影響的,與 JavaScript 算是同門師兄,它們的語法經過了實踐考驗,非常適合函數式編程。這種優雅的語言獨具魅力,即將面世的 2013 版的淘寶首頁即采用了 CoffeeScript 實現。
  TypeScript 是微軟開發的 JavaScript 的超集,TypeScript 兼容 JavaScript,可以載入 JavaScript 代碼然后運行。與 JavaScript 相比,TypeScript 進步的地方在于:加入注釋,讓編譯器理解所支持的對象和函數,編譯器會移除注釋,不會增加開銷;增加一個完整的類結構,使之更像是傳統的面向對象語言。由于 JavaScript 只是一個腳本語言,并非用于開發大型 Web 應用,所以沒有提供類和模塊的概念。而 TypeScript 擴展了 JavaScript 實現了這些特性,能更好地支持大規模 JavaScript 應用開發,吸引了不開發者。但要注意,雖然 TypeScript 有微軟做后盾看起來很有保證,但目前提供的只是早期的預覽版本,TypeScript 并不像它的網站看起來那樣精美,最終版本可能會在一年后 ECMAScript6 發布會確定,現在的版本只是個開發預覽版。因此,TypeScript 今后發展如何,還需要進一步觀察。
  此外,在服務器端,Node.js 越來越流行。如今 Node.js 不僅作為處理高并發請求的中間層解決方案,還因其靈活的語法和豐富的底層 API,越來越多的人開始用它來寫工具,尤其是之前基于 Ant 或者 Java 的一些工具如今都有了 Node.js 的版本。
  如此看來,Node.js 在命令行工具領域有著更加廣闊的應用場景,甚至可以代替 Perl 或者 Ruby 這些傳統的動態語言。在淘寶 Node.js 已有非常多的應用場景,例如在數據部門,Node.js 被用作處理高并發場景下的容池,專門吸收高并發的請求,甚至能夠保持和客戶端的長鏈接,而這在之前則需要花費很高昂的成本,例如 Comet 技術等。此外,淘寶的開源前端類庫 KISSY 也可以直接運行于 Node.js 環境,這樣就可以在命令行運行 KISSY 代碼,很多前端代碼就有機會采用自動化測試等,提高生產效率。再者,淘寶內部的開發工具鏈也已大部分采用 Node.js 來構建了。
  百花齊放的類庫和框架 
  SeaJS 是由支付寶前端高級技術專家王保平(玉伯)開發的一個遵循 CMD 規范的模塊加載框架,可用來輕松愉悅地加載任意 JavaScript 模塊和 CSS 模塊。SeaJS 非常小巧,小巧在于其壓縮后體積只有 4KB,而且接口和方法也非常少。SeaJS 有兩個核心:模塊的定義和模塊的加載。SeaJS 可以加載任意 JavaScript 模塊和 CSS 模塊,能保證你在使用一個模塊時,已將所依賴的其他模塊載入腳本運行環境中。SeaJS 可以讓你享受寫代碼的樂趣,不用去管那些加載的問題。畢竟現在網頁的可維護性和性能問題一樣嚴峻,體現在:文件太多,不利于維護,前端后端都一樣;HTTP 請求過多,當然這個可以通過合并解決,但如果沒有后端直接合并,那么人工成本會非常大。用 SeaJS 就能非常好地解決這些問題。SeaJS 遵循 CMD 規范,因此可以很方便地書寫模塊。目前已經有越來越多的人采用 CMD 規范來開發項目了。
  最近微軟已經正式發布了 Windows8 操作系統,Windows 操作系統的風格已經完全變成了磁貼狀的 MetroUI。對于微軟來說,這是一個巨大的改變,而且所有微軟的平臺包括桌面、平板、移動端及其網站都使用這個 UI 風格。
  MetroUICSS 是一個非常完整的創建 Metro 風格的網站框架。它自成體系,但也可以與其他框架一起使用。使用 LESS 創建,并且擁有網格系統、排版樣式、表格、按鈕和圖片。同時也擁有內建的 JavaScript 組件,幫助你生成片狀、菜單、邊欄、進度條和提示等,是一個非常好用的框架。隨著 Windows8 的進一步流行,這種風格的 CSS 類庫一定會成為一種趨勢。
  Hype 是一個小巧的工具,是 MacAppStore 新上架的一個 HTML5 創作工具,其長處是可以在網頁上做出悅目的動畫效果,無須 Flash 插件。開發該應用的公司 Tumult 由兩個前蘋果工程師創建,并獲得了 YCombinator 的投資。由于公司的聯合創始人之一 JonathanDeutsch 曾擔任 Mail.app 后端的技術主管,因此他在接受 PaulHontz 的 TheStartupFoundry 訪談時,談到公司創始是為了解決 HTML5 創作工具缺乏的問題。可以說,Hype 是第一個可用的創作 HTML5 產品的可視化工具,具有里程碑式的意義。隨著硬件性能提升,HTML5 的應用程序更加傾向于被工具生成,而不像傳統意義上由工程師 " 切 " 出來。因此工具化是一個方向,不管 HTML5 是否真的能在移動終端扎下腳跟,這種方向是值得堅持的。畢竟,HTML5 的應用開發現在還處于原始社會。
  iScroll.js 是使用原生 JavaScript 編寫的一個模擬滾動效果的小類庫,不依賴于任何 JavaScript 框架。旨在解決移動 WebKit 系瀏覽器的區域滾動問題,兼容 MobileSafari、Android 默認瀏覽器、Safari、Chrome、Firefox5+、Opera11+、IE9+ 及其他 WebKit 核心瀏覽器。最新版本為 iScroll4。這個小庫一問世就備受關注,因為它不僅可以在 PC 端完美模擬滾動效果,在移動終端里對觸屏事件的支持也堪稱完美。
  iScroll4 是 2011 年底問世的,2012 年在移動終端產品開發中大放異彩,在淘寶的諸多產品中都用到了這個 JavaScript 庫。iScroll 是小而精的經典作品,名字也帶著蘋果范兒。但美中不足的是,只能使用 ID 調用。不過這個小特性不是什么大問題,可以通過二次封裝來解決。期待 iScroll4 在移動終端里有更多精彩的表現。
  前端 MVC 在 2011 年是比較火的話題,隨著越來越多的人開始嘗試使用諸如 JavaScriptMVC 和 Backbone.js 這些 MVC 類庫,更多的產品也看起來更像 " 軟件 " 而非 " 網頁 "。但由于前端環境的復雜性,我們也漸漸發現 " 這種 "MVC 并非完美,只能應用于 " 基于數據驅動 " 的場景,而對 " 基于事件驅動 " 的場景卻沒有太好的解決辦法。目前,淘寶有很多產品在嘗試使用 " 有限自動機 " 來彌補 MVC 在這方面的不足。因此,新場景下的 MVC 還需要更深入的提煉。
  工程化的 Web 前端開發規范 
  2012 年,關于前端開發編碼規范的討論愈來愈多。國外和國內的頂尖開發者幾乎同時對編碼規范產生了很大興趣,前 Yahoo! 首頁首席前端工程師 N.C.Zakas 在他那本《高可維護的 JavaScript》書中也提到規范在團隊協作過程中的重要性。而如下這兩個方面,是值得我們探討和深思的。
  AMD 與 CMD 規范之爭,隨著 CommonJS 的進一步普及,CommonJS 規范在標準的模塊開發領域發揮著越來越重要的作用,而 CommonJS 在瀏覽器端的難以實現卻為這份規范增添了一絲變數。本質上講,CommonJS 是一種用于同步加載 JavaScript 代碼的 API 規范,非常簡單優雅。為了在瀏覽器端實現這種機制,則不得不加入了一層異步回調,這便是 AMD(Modules/Asynchronous-Definition)。RequireJS 實現了這個規范,而 Dojo 也將馬上完全支持(Dojo1.6)。規范本身非常簡單,甚至只包含了一個 API。玉伯在開發 SeaJS 的過程中,更多地保持了 CommonJSModules 規范的風格,即 CMD(CommonModuleDefinition)。較之 AMD,CMD 沒有采用單一的 API 來適用于多個功能,而是根據不同功能定義不同的 API。我認為,兩者在完備性上是基本一致的,但在社區理念和編程風格上有所差異,開發者可以根據自己的偏好來選擇使用 AMD 還是 CMD 編程風格。
  Java 語言編碼規范對于前端開發編程規范有非常大的影響。在 Zakas 的《高可維護性 JavaScript》一書中提到了五種 JavaScript 編程規范,都和 Java 語言編碼規范有著類似的淵源:Crockford 編程規范、jQuery 核心風格指南、SproutCore 編程風格指南、Google 的 JavaScript 風格指南和 Dojo 編程風格指南。不管是哪種規范,都強調了編碼風格一致的重要性,這也可看出,前端團隊開發越來越看重規范,JavaScript 的靈活性需要某種程度的限制。
  總之,通過上面的闡述,我們可以看到前端技術的不斷進步和推陳出新,也能夠體會到項目過程的工程化,解決方案的輕量化,庫和框架的多元化,知識結構的體系化,這種趨勢在今后會變得越來越明顯,也昭示著前端技術的發展方向。
  說到前端技術知識結構的體系化建設,這是我這些年來一直都在做的事情,在 2011 年也畫了一張圖來說明我的觀點——前端技術體系的建設是一項長期的任務。畢竟前端新技術新知識層出不窮,對于經典的知識結構的整理也很有挑戰性,但這項工作終究需要有人去做,為新入道的人指出一個大致的方向。對于前端工程師的成長問題,我也寫過一篇長文 " 前端開發十日談 ",幫助新人們解惑。
原文地址:http://iphone.myzaker.com/l.php?l=540813b91bc8e05d118b456a

該文章在 2014/9/5 6:56:40 編輯過
關鍵字查詢
相關文章
正在查詢...
點晴ERP是一款針對中小制造業的專業生產管理軟件系統,系統成熟度和易用性得到了國內大量中小企業的青睞。
點晴PMS碼頭管理系統主要針對港口碼頭集裝箱與散貨日常運作、調度、堆場、車隊、財務費用、相關報表等業務管理,結合碼頭的業務特點,圍繞調度、堆場作業而開發的。集技術的先進性、管理的有效性于一體,是物流碼頭及其他港口類企業的高效ERP管理信息系統。
點晴WMS倉儲管理系統提供了貨物產品管理,銷售管理,采購管理,倉儲管理,倉庫管理,保質期管理,貨位管理,庫位管理,生產管理,WMS管理系統,標簽打印,條形碼,二維碼管理,批號管理軟件。
點晴免費OA是一款軟件和通用服務都免費,不限功能、不限時間、不限用戶的免費OA協同辦公管理系統。
Copyright 2010-2025 ClickSun All Rights Reserved