2012年又有那些Web新興技術需要開發(fā)者去關注
分享 2012.03.24 瀏覽次數(shù):8676次
WebGL
WebGL是一種基于Web的Graphic庫,由非盈利組織Khronos運營,目前結(jié)合HTML5元素廣泛應用在3D圖形開發(fā)中。
學習WebGL比較困難,因為它是底層開發(fā)——它運行在GPU上面,而且它實際上是一個OpenGL的JavaScript port,是一種游戲開發(fā)者使用的已經(jīng)長期建立的API集。WebGL的主要受眾是哪些已經(jīng)擁有豐富OpenGL經(jīng)驗的游戲開發(fā)者,他們可以通過WebGL為web平臺編寫游戲。
好在有很多資源可以幫助您學習WebGL,這些資源不僅僅是關于游戲開發(fā)的,還有很多奇幻的圖形、視覺和音樂視頻等方面。作者個人比較推薦的是:
WebGL目前在所有桌面瀏覽器(發(fā)布版和開發(fā)頻道)中都支持,除了IE10(微軟表示不支持)。對于移動產(chǎn)品來說,已經(jīng)在Opera Mobile 12中發(fā)布了,最終會出現(xiàn)在Android,BlackBerry Playbook 2.0,Nokia N900,SonyEricsson Xpertia Android Phones等以及Firefox移動瀏覽器中。
SVG
SVG(Scalable Vector Graphics)已經(jīng)在Opera,F(xiàn)irefox,Chrome中存在多年了,但是直到IE9開始支持它之后才漸漸變得主流一些它在HTML5的光環(huán)下顯得有點暗淡,盡管SVG和HTML5是面向不用應用的不同工具。
Canvas2D可以迅速paint圖形到屏幕上面,這一點很犀利。但是其全部功能就是paint了,沒有內(nèi)存來做那些(位置,頂層或其他)其他功能。如果您需要那種book-keeping工作,就只能自己用JavaScript實現(xiàn),因為Canvas2D不會把DOM保存到內(nèi)存中,也正因為如此Canvas2D速度快,十分適合第一人稱射擊類應用。
與Canvas2D不同,SVG在您需要保存DOM的時候就給力了。使用JavaScript,所有的Objects都可以移動并且與動畫無關。您可以試試Daniel Davis做的復古類SVG游戲Inbox Attack(http://people.opera.com/danield/svg/inbox-attack.svg)來體驗一下,并且看看源代碼來了解如何完成動畫效果。
因為shape和path是用Markup來描述的,所以他們可以用CSS來定型。與不同,text在SVG中保持text格式并且更加的靈活,更加可擴展,更加易于訪問。在Canvas中,text變成了像素,就像Photoshop中的圖形text。
SVG最強大的特性是它基于矢量,這樣您的插圖,圖形和UI圖標等都是矢量圖了,這樣無論是在50英寸的電視屏還是手機屏幕桌面上,看上去感覺都是一樣的清晰。在當今這樣一個web應用無處不在的時代,SVG圖形甚至可以包括媒體查詢,可以是響應式的,可以根據(jù)不同的目標設備做尺寸的調(diào)整。
綜上所述,在最新的桌面瀏覽器中SVG已經(jīng)能被廣泛支持了。在移動產(chǎn)品方面的支持總體上來說也很好,以及預期在Android 3.0版本之前原生瀏覽器也會支持它了。
getUserMedia
不像那些被錯誤地稱為HTML5的API,getUserMeida(在下文中簡寫為gUM)有個相對正當?shù)睦碛桑浩鸪跛荋TML5元素,之后它改名了然后離開了W3C WebRTC規(guī)范集合。
gUM允許訪問用戶的攝像頭和麥克風,本來是在WebRTC規(guī)范中在瀏覽器中進行P2P視頻會議的,當gUM擁有了其他的用途,就離開了WebRTC。
攝像頭的訪問最終在Opera12安卓版,Opera桌面實驗室和Google Chrome Canary里面實現(xiàn)了,不過Opera和Chrome都還沒有實現(xiàn)麥克風的接入。
W3C規(guī)范依然在用,所以Opera和Webkit有不同的語法規(guī)范,這樣的麻煩被一個叫做The gUM Shield,的小JavaScript片段搞定了。如果您想更深入地了解這方面請看作者的另一篇文章:It’s Curtains for Marital Strife Thanks to getUserMedia
當視頻從設備開始流傳輸?shù)臅r候,源數(shù)據(jù)可以被做成變成了元素,如果需要的話還可以被定為到屏幕外面,然后拷貝到里面進行所需要的操作。Paul Neave寫的《HTML5變成玩具!》(http://neave.com/webcam/html5/)為了方便操作把流媒體數(shù)據(jù)拷貝到WebGL中。作者在.net雜志的226話有采訪他的報導。
如果想把web app的功能做得像native app,gUM需要做很多的工作。試了一下Neaver的gum和WebGL在Opera Mobile 12上面的demo,感覺和平臺獨有的app一樣富有響應式并且很時髦。當在瀏覽器產(chǎn)品中其功能被廣泛應用的時候,作者語言會有很多基于web的QR代碼閱讀者以及很多增強現(xiàn)實的應用。
File APIs
W3C File APIs允許JavaScript訪問本地文件,其中最常用的API是FileReader,可以從Opera,F(xiàn)ireFox,IE10平臺等的預覽版看到(不包括Safari)。
這一份W3C規(guī)范“為了在web應用中提供API來代表文件對象,以及編程選擇和訪問數(shù)據(jù)”。例如:你可以上傳文件到瀏覽器中,并本地查找相關信息(例如文件名,尺寸,類型)而不需要到服務器端。您也可以打開文件,操作內(nèi)容,這樣可以加強基于瀏覽器的應用的交互性,用起來更像是本地應用。
另一個常用的用途是使傳統(tǒng)的圖像上傳兌換狂更具有Web2.0特色:通過允許在瀏覽器內(nèi)部的Drag and Drop,而不是本地文件系統(tǒng)中改變。
您可以通過使用一個普通的開始,然后循序漸進地提高。HTML5 Drag&Drop支持特征檢測,如果存在的話就使用
替換,那就是您的drag圖像目標了。當圖像被drag到目標的時候,使用File Reader API來顯示一個指甲蓋大小的圖像。您可以看一下Remy Sharp的demo。
Feature-detecting,progressive enhancement and upgrade messages(特征檢測,漸進式增強和消息通知)
誠然,在沒有那些奇幻的API的時候,大家總是試圖使用漸進式增強和HTML語義的方法讓網(wǎng)站照常工作。然而有時候卻不能這樣,例如Paul Neaver的《HTML5變成玩具》中,如果gUM和WebGL現(xiàn)在不存在的話,其網(wǎng)站不能有什么補救措施了,整個網(wǎng)站的核心都沒了。
在這樣的情況下有兩種典型的慣例:要么是顯示一條消息說“你的瀏覽器太垃圾了,塞油哪啦”或者說“你必須用Chrome6/Firefox 4/Opera10等[插入能支持你應用的瀏覽器]才能訪問”。第一種方法又沒用又粗魯,沒有建議和補救措施;第二種方法是個臨時辦法,因為六個月之內(nèi)所有瀏覽器可能都能支持你現(xiàn)在使用的技術了,讓你在網(wǎng)站上留下的信息過時:例如您寫的解決方案是建議使用Firefox4來訪問,可是半年后用戶安裝著Firefox7回來訪問你的頁面了,這可就真的沒救了。
HTML5 Please API把開發(fā)人員的語言(和特性)翻譯成用戶能理解的語言(瀏覽器)。通過調(diào)用這個API你就可以得到一些HTML返回值來告訴訪問者,或者返回一個帶有相關數(shù)據(jù)的JSON對象(包括瀏覽器Logo及下載介紹等信息)。這樣您可以根據(jù)不同的客戶來顯示不同的補救信息了。
結(jié)束語:
正如您所看到的,大量的令人驚喜的新技術正在接踵而至,您著手研究上述某項技術的時候恐怕又要擔心更新鮮的技術到來了吧。希望您開發(fā)得愉快,請記得讓您所開發(fā)的應用在盡可能多的瀏覽器上面測試一下。
杭州網(wǎng)站建設更多:談談HTML5最突出的特性與功能
- PREV:我們怎么去看待企業(yè)網(wǎng)站推廣
- NEXT:怎么理解-程序員年過三十這道坎
-
杭州網(wǎng)站設計公司:品牌網(wǎng)站開發(fā)助力企業(yè)成長
日期:2024-12-20瀏覽次數(shù):448次
-
杭州網(wǎng)站建設公司:商城網(wǎng)站建設的六大關鍵步驟
日期:2024-12-18瀏覽次數(shù):518次
-
杭州網(wǎng)站制作:醫(yī)院網(wǎng)站設計與域名備案的復雜性探討
日期:2024-12-18瀏覽次數(shù):522次
-
杭州網(wǎng)站制作公司:打造安全可靠的醫(yī)院網(wǎng)站
日期:2024-12-11瀏覽次數(shù):731次
-
杭州網(wǎng)站設計公司:數(shù)據(jù)庫在高端網(wǎng)站制作中的關鍵作用
日期:2024-12-11瀏覽次數(shù):701次
相關新聞
整合同類新聞,相關新聞一手掌握
-
農(nóng)業(yè)電商APP開發(fā)功能需求分析
日期:2021-03-10瀏覽次數(shù):1975次
-
農(nóng)業(yè)app開發(fā)常見的功能
日期:2021-03-09瀏覽次數(shù):1957次
最新新聞
與互聯(lián)網(wǎng)同行,實時掌握網(wǎng)建行業(yè)最新動態(tài)
-
論原生APP的后臺開發(fā)
日期:2020-04-23瀏覽次數(shù):5454次
-
杭州定制app后如何提高app用戶體驗
日期:2021-02-04瀏覽次數(shù):4062次
-
如何讓你的高端網(wǎng)頁設計干凈大方簡潔?
日期:2021-05-14瀏覽次數(shù):4015次
-
杭州開發(fā)小程序?qū)ζ髽I(yè)及品牌來說有哪些優(yōu)勢呢?
日期:2021-10-27瀏覽次數(shù):3685次
-
淮北網(wǎng)站制作 大家都選-杭州帷拓
日期:2023-02-08瀏覽次數(shù):1546次
隨機新聞
新聞新動態(tài),您需要的新聞管家
洞悉市場趨勢演變讓傳播回歸社會
免費獲取網(wǎng)站建設與網(wǎng)絡推廣方案報價
-
關于我們
杭州帷拓科技有限公司,是一家新型的全案網(wǎng)絡開發(fā)公司,作為以互聯(lián)網(wǎng)高端網(wǎng)站建設、APP開發(fā)、小程序開發(fā)為核心的專業(yè)網(wǎng)絡技術服務供應商,帷拓科技致力于全面分析市場環(huán)境、衡量與預測市場需求、整合區(qū)別于行業(yè)競爭對手的絕對優(yōu)勢,結(jié)合品牌理念深度挖掘項目優(yōu)勢和產(chǎn)品價值,提升客戶品牌認知、認可度。
-
我們的客戶
帷拓科技歷經(jīng)十年沉淀,與國內(nèi)外上千家客戶達成合作關系,其中穩(wěn)定合作的公司有:浙江華為、浙江移動、浙江5G產(chǎn)業(yè)聯(lián)盟、浙江省社科院、綠城足球俱樂部、娃哈哈雙語學校、健康中國杭州峰會、科雷機電等,帷拓科技始終堅持“帷有專業(yè),才能拓展無限”的服務理念,堅持“認真堅持細節(jié)”的優(yōu)質(zhì)服務理念,不斷完善自身,成就企業(yè),最終實現(xiàn)共贏。
-
我們的業(yè)務
帷拓科技主營業(yè)務范圍包含互聯(lián)網(wǎng)高端網(wǎng)站建設、APP開發(fā)、小程序開發(fā)、商城網(wǎng)站建設、公眾號運營以及數(shù)字營銷等,涵蓋了服務、房產(chǎn)、數(shù)碼、服裝、物流貿(mào)易等行業(yè),根據(jù)品牌現(xiàn)狀,為每個客戶量身定制項目整體服務方案,以敏銳的市場洞察力、創(chuàng)新的市場策劃能力,全面把握市場變化,為客戶實現(xiàn)從企業(yè)到消費者的價值轉(zhuǎn)換。