靈魂-放水

2007年web開發技術預言

作者：cleverpig

此圖來源于1954年的《現代機械雜志》，圖中展現了那時對2004年“家庭電腦”的預言


前言

????????2006年即將過去，這一年被廣泛地看作是：在線投資新浪潮的一年；更新的web技術和技巧興起和成長年；在采用web標準上增長年；從未這樣采用web能量的新商務模式的興起（和衰落）的一年。
????????從SitePoint和Ektron這兩家組織提供的調查報告預覽版中，其中的數據照射出在技術進化進程中的一絲亮光。大家不妨跟隨作者一起放眼遙望一下亮光周圍的風景，也許你會聽到自己的驚呼，請加入到對“未來”的預言中吧！嘗試一下網絡對趨勢的影響力！

關于SitePoint和Ektron進行的2006/2007 web開發現況調查

????????2006/2007 Web開發現狀調查是在十年間致力于積極倡導和幫助web開發者、設計者和其它在線專業人員的SitePoint和Ektron共同進行的一項研究成果。

????????SitePoint是一家快速興起的在線媒體公司和面向web專業市場（尤其在web開發和設計領域）的信息提供者。其網站：sitepoint.com，目前在全球web設計和開發>新聞和媒體分類的網站中排名列第一位，根據Alexa.com數據表明，其網站在全球排名位于前300名之內。Sitepoint.com的日訪問量可與一些主流媒體集團的網站所匹敵。

????????SitePoint論壇具有超過135000名注冊用戶，其新聞每月到達50萬份訂閱。SitePoint公司具有遍布于174個國家的70000名客戶、試用產品的注冊用戶高達620000名，具有五大收入來源：廣告、贊助關系、基于內容的產品（包括在線和零售產品）、近來非常流行的視頻訂閱、分類列表和產業報告。

????????同樣，Ektron有限公司成立于1998年，作為以CMS400.NET和eWebEditPro產品線為依托的web內容管理軟件和web寫作工具的技術和市場領導者，這些軟件已經授權給千分之十的web專業人士，使他們更加高效地把web作為通訊和交互的有效平臺。

????????SitePoint和Ektron兩者之間成熟的合作關系以及他們對web專業人士社團的支持，導致了在2006年初的idea：衡量在這兩個組織周邊的web開發者和其他web從業人士這個大眾群體，以便找出一個“時間快照”（snapshot in time）、量化web開發工具狀況、技術、技巧和趨勢。

????????在2006年6月15日至7月15日之間對5000名web從業人士進行了此項調查。我們相信這可能是有史以來最大規模的一次web開發者調查，這次調查的深刻意義之一就是反映當前現實狀態和將要發生的變化。


Web標準的依從現狀

CSS——輕舞飛揚的頁面布局


圖-1 采用CSS進行布局的分布圖


????????評論：CSS布局不但對頁面具有減肥的效果，而且對于統一風格、代碼重用、瀏覽訪問、打印頗有益處：

????????1．加快下載速度：
????????CSS現在比表格更快：因為瀏覽器在顯示表格內容前讀取它們兩次，第一次完成它們的結構，第二次才確定它們的內容。
????????表格不能被部分地顯示，直到整個表格被下載和渲染完成后才被顯示出來。
????????通常，CSS代碼量少于笨重的表格。
????????所有的布局代碼都可以保存到一個外部CSS文件中，在用戶的瀏覽器中僅被調用一次而后被緩存；而表格布局則必須在每個HTML文檔中保存，并且在每次刷新時被重新下載。
????????使用CSS可以控制CSS項的下載順序，這使在慢速的圖片下載完成之前用戶就可以閱讀內容。
????????
????????2．被更廣泛地訪問：
????????通過手持設備的瀏覽web用戶數量正在與日俱增。在2008年PDA銷售量將達到5千8百萬（數據來源于eTForecast），世界三分之一的人口將擁有一臺無線設備（數據來源于ClickZ）。而你可以編寫專用于手持設備、額外的CSS文檔——這個CSS文檔內容可以取自以往的CSS文檔。
????????有關內容可以參考：j2mepolish 的CSS for J2ME文檔。

????????3．對搜索引擎更加友好：
????????搜索引擎在CSS驅動的頁面中爬行要比在簡單的HTML代碼來得更容易。這樣，搜索引擎可以對web頁面進行更加有依據的猜測（比如：猜測頁面的內容），所以使用CSS布局的web頁面能夠在搜索排行中擁有更高的排行。
????????有關內容可以參考：SE在線雜志。
????????
????????4．打印友好：
????????當用戶選擇打印頁面時，另一套可選的CSS文檔可以被調用，這個文檔可以規定格式、圖片、隱藏導航、校正顯示在打印版本中的頁面內容。

驗證HTML代碼——多重瀏覽器標準的穿越者


圖-2 應用web頁面驗證的分布圖

????????評論：服從web標準將引領web站點走向成功，更友好地與搜索引擎“協作”、快速load頁面、減輕Server負載、兼容眾多瀏覽器、吸引更廣泛的瀏覽量。

????????什么是HTML 驗證（HTML validate）？
????????它是通過與標準HTML規則進行比較的方式，分析HTML文檔、標記出錯誤和非標準代碼的處理過程。Web頁面使用HTML進行渲染，而HTML本身采用了HTML規范作為其規則和標準。
????????這里推薦兩個權威的HTML驗證在線服務：W3C的validator、WDG的validator。當然，在開發工具中的驗證工具更不勝枚舉：Dreamweaver內置驗證器、Eclipse的WSVT等。

????????1．Web站點訪問性：
????????驗證HTML代碼幫助你找出那些微小的不規范之處，從而防止它們妨礙搜索引擎爬蟲或者瀏覽者。這樣使你的站點獲得更多的瀏覽者、更廣泛的訪問設備范圍（手持設備、文本瀏覽器、搜索引擎等）。

????????2．對搜索引擎友好：
????????清晰、明快的代碼可以使搜索引擎更快、更完整地頁面中爬行。

????????3．更快速的裝載：
????????如果你的頁面包含了HTML錯誤，它將花費搜索引擎比較長的爬行時間，因此其排行位置也會變低。更加直觀的是——如果你的頁面在10秒內沒有裝載完畢，那么瀏覽者可能會離開。

????????4．減少服務器負載：
????????簡明的代碼不會像復雜的代碼或者包含內嵌表格的代碼那樣讓你的服務器負擔加重。級聯CSS將減少代碼量，降低對web服務器空間的需要和對帶寬的占有量、節省服務器的內存。

????????5．易于更新和維護站點：
????????無錯的頁面代碼利于修改，這對于站點設計者來講意味著節省時間和維護經費。

????????6．瀏覽器兼容性：
????????驗證代碼取保你的站點與當前的瀏覽器相兼容。既然我們無法預見未來的瀏覽器標準，那么驗證代碼就是把握未來瀏覽器標準的最佳方式。

????????7．更多的訪問者：
????????保證了瀏覽器兼容性，也就贏得了大量的瀏覽者，從而獲得更多的收益。

開發技術應用趨勢

XP技術——潛力無限，業已成為技術熱點


圖-3 在web開發工作中進行實踐的技術分布圖


????????評論：OOP仍然是主流技術，盡管MVC占有不少的份額，但“用戶體驗才是產品的價值所在”這句話仍然得到了驗證。無論任何技術理論（包括MVC、Ajax、RoR等），凡是能夠高效地應用在快速開發、提高用戶體驗上的才是好技術。
????????Code review和Unit Testing都是極限編程（XP）中的概念，從圖表中的比例來講，讓我感到欣慰：在開發技術中XP結對編程的方法得到了比較廣泛的應用，希望國人也能更多的接受、應用它們。

????????什么是Code Review：在起始開發階段對源代碼語法檢測，以期發現和修正錯誤、提高代碼質量的活動，常稱之為結對復查（peer review）。Code review經常可以發現和去除一些常見安全漏洞，比如格式化字符串攻擊、競爭條件、緩沖區溢出，因此提升了軟件的安全性。

????????什么是Unit Testing：單元測試是一種用來驗證源代碼的某個模塊是否工作正常的活動。而每個測試實例都彼此獨立；假對象（mock object）可以用于在隔離的環境下輔助測試某個模塊。這樣做目的在于把程序的每個部分分割開來、驗證獨立的部分是否正確。

????????采用結對編程可以在QA測試之前捕捉、修正錯誤，但不僅如此：

????????1．它使最終的錯誤內容下降到讓人滿意的程度，這源于采用持續的code review。

????????2．采用頭腦風暴（brainstorm）和結對輪換（pair replay）使設計更加完善、代碼長度更短。

????????3．依靠結對輪換團隊解決問題更加迅速。

????????4．團隊成員能夠學習到關于系統和軟件開發的更多知識。

????????5．項目結束時，多個團隊成員能了解系統的每個部分。

????????6．成員在一起相互學習、談話，提供了更好的信息流動和團隊動力。

????????7．成員更加享受他們的工作，更加擁有成就感。

????????這種方式尤其適用于缺少人手或者短缺昂貴的專業測試系統和QA的開發團隊。

工具流行趨勢

Dreamweaver——web開發工具中的王者


圖-4 web開發中采用的工具分布圖


????????評論：DW能力十足，無論對于web設計者還是開發者來講都是很順手的工具，但其語法自動提示能力實在有限。而且對于開發者而言，DW的超強編輯能力也注定了它overkill的宿命，這也是Text Editor和它平分秋色的原因之一。
????????VS功能強大，但其受到微軟語言的制肘，無法伸展開有力的上臂來擁抱各種開源語言。

????????這里我要遺憾地感嘆一下Eclipse WTP，它提供的HTML 編輯器用上去還算可以，但相比之下相形見絀，不免有些雞肋之嫌，還需要進一步完善：

????????1．Eclipse WTP的優點：
????????在同一個IDE中支持Java, JavaScript和ActionScript等多種語言。
????????“All In One”的發布模式是它易于安裝。
????????概要視圖（Outline View）對方法和變量進行很好的組織。
????????對JavaScript function提供了代碼提示。
????????提供了對web頁面的驗證功能。

????????2．Eclipse WTP的缺點：
????????缺少本地或者在線文檔，甚至連說明文件也沒有，非常不利于初學者使用。
????????語言支持（比如ASP）有限，擴展能力弱。使之支持其它語言就必須手工添加，也許這是HTML編輯器的通病。
????????概要視圖（Outline View）并不支持JavaScript的方法和類。
????????WTP沒有提供良好的頁面設計視圖。
????????WTP對頁面進行驗證性能不佳。


Web開發技術流行趨勢

PHP——高效、穩定的圣殿輕騎兵


圖-5 web開發語言平臺分布圖


????????評論：很欣慰地看到作為“開源常青樹”的PHP獲得如此殊榮。由于PHP的高效、全能、強適應能力、強擴展能力，所以獲得了眾多開發者的青睞。
????????同時作為傳統語言的ASP和JSP依然在勢均力敵的博弈，而春風得意的后生Ruby可謂潛力無限，當然這也得益于RoR的流行。但是從Ruby占5.31%的比例來看，RoR還不是企業應用開發的主流。
????????
????????PHP何以如此紅火？
????????1．高效性：
????????基于C語言的特性已經使其具備了高效的潛質，再加上支持頁面模板技術的smart引擎、提供代碼重用能力的PEAR、可替代循環的正則表達式等，使其在服務器端執行效率得到了加強。

????????2．應用范圍廣：
????????服務端腳本——這是PHP的傳統領域，也是最主要的目標領域；
????????命令行腳本——可以編寫一段 PHP 腳本，并且不需要任何服務器或者瀏覽器來運行它；
????????桌面應用——編寫可以利用PHP-GTK來編寫桌面應用程序。

????????3．強適應能力：
????????使用PHP開發時不但可以自由地選擇操作系統和web服務器，而且可以根據需要選擇使用面對過程和面對對象，或者兩者混和的方式來開發。

????????4．強擴展能力：
????????PHP 最強大最顯著的特性之一，是它支持很大范圍的數據庫。
????????PHP 還支持利用諸如 LDAP、IMAP、SNMP、NNTP、POP3、HTTP、COM（Windows 環境）等不計其數的協議的服務。
????????而且它具有極其有效的文本處理特性，支持從 POSIX 擴展或者 Perl 正則表達式到 XML 文檔解析。
????????如果將 PHP 用于電子商務領域，會發現其Cybercash、CyberMUT、VeriSign Payflow Pro等支付方式以及 MCVE 函數對于在線交易程序來說是非常有用的。

????????另外，eweek網站完成的《2006年10大應該學習語言》，也值得大家作為學習的參考：
????????1. PHP
????????2. C#
????????3. AJAX (Asynchronous JavaScript and XML)
????????4. JavaScript
????????5. Perl
????????6. C
????????7. Ruby and Ruby on Rails（RoR）
????????8. Java
????????9. Python
????????10. VB.Net (Visual Basic .Net)

聚合推動web運轉的車輪


圖-6 當前web應用項目的技術分布圖


????????評論：由此可見，經過僅僅2、3年的發展，聚合技術已經撐起了web前進的舵盤，隨之興起的AJAX、JavaScript、Blog、Wiki、Podcast也依靠聚合技術傳遍了世界每個角落。Flash雖然份額不小，但其也緩慢地轉向客戶端腳本的方向以進一步提高優雅的用戶體驗。
????????回到我前面的原理：“用戶體驗決定了技術發展方向，而不是理論。”，聚合技術的興起必定帶動客戶端和服務端的技術提升。我相信未來幾年web屬于結構化blog和Feed網絡：

????????結構化Blog（Structured Blog）：
????????一種新興的、實驗性的Blog，它最終把信息傳送到語義網（Semantic web）。尤其是它提供了自描述內容，這種自描述內容可以被輕松地植入到web站點或者Blog中，提供給Blog作者建立和聚合結構化信息（比如評論、事件、媒體）的工具。
????????在傳統Blog記錄和結構化Blog記錄之間的不同之處——后者發布的內容是計算機可讀取的格式，其它的聚合服務可以理解它們，使用它們來生產事件日歷（calendars of events）、任務板（job boards）、書籍評論（book reviews）或者影視投票。當然，結構化Blog也遵循RSS和Atom標準。結構化Blog通常處理結構化的內容格式，比如微內容（microcontent）。

????????注：語義網（Semantic web）：是在萬維網上，通過放置計算機可處理的文檔來進行信息交換最終建立一個全球媒介的項目。目前語義網在萬維網協會Tim Berners-Lee先生的指導下，正通過使用標準、標記語言和相關的處理工具對web進行著擴展。

????????注：微內容（microcontent）：微內容是一種以短小形式發布的信息，它的長度受到了話題長度的限定和軟件的技術限制。

????????Feed網絡（FeedMesh）：
????????FeedMesh是一組用來建立“結對網絡（peering network）”、完成對分散的web更新通知和內容發布的技術。采用web聚合的在線服務商，包括PubSub、Feedster、Technorati、Bloglines、Yahoo共同參加制定了一項共享weblog更新通知服務（“pings”時常見的一種更新通知服務方式）的標準。
????????它使blog作者和聚合發布者從中獲益：更快速的內容發布、可靠的可升級的通知服務。而對于在線服務的客戶來講，好處則是帶寬的節省和低延遲。

Ajax成為開發者未來一年的學習趨向


圖-7 web開發者希望從web或者出版物獲得技術的分布圖


????????評論：從分布圖來看，47%被調查的web開發者通過web或者出版物來希望獲得更多的AJAX知識，而將近34%和29%的被調查者希望獲得XHTML/CSS和PHP的web文章或者書籍。
????????本人認為："Web2.0之所以如此精彩，這正是web聚合（syndication）作用的結果。Blog、Wiki都被廣泛地應用在web寫作領域，而Blog比Wiki更流行，真是由于其更加易于聚合、推廣。聚合技術所依仗的便是RSS、Atom之類的標準，而這些標準的技術支持便是XHTML/CSS/XML，而AJAX為Blog、Wiki提供了完成優良的用戶體驗。"

????????國內已經出版的Ajax圖書：
????????《Ajax基礎教程》（《Foundations of Ajax》中文版）
????????《Ajax實戰》（《Ajax in Action》中文版）
????????《Ajax修煉之道》（《Pragmatic Ajax》中文版）

????????本人感覺《Ajax實戰》是最為深入全面的AJAX開發手冊（詳情見：書評：《Ajax實戰》）。大家還可以看看第二書店的 Ajax專題，包括了目前國內已經出版和即將出版的所有Ajax圖書。

在web業界的下一件重大事件將是什么？


圖-8 在未來每個人都會在15分鐘成為大明星？


????????不妨讓我們了解一下SitePoint&Ektron調查報告中的大眾觀點，也許看過之后，你也想說說自己idea：
{
—“實時虛擬3D視圖和站點導航，你的鼠標指針不僅可以在x、y軸上移動，而且還可以在網站的內部（z軸）移動。”

—“我想象不出下一件大事是什么，而在向標準靠攏的趨勢下，利用有依據的技術和語義將幫助我們在資源之間建立更加緊密牢靠地關系。”

—“我認為我們將繼續看到優雅性、功能性占有統治地位。我認為那些現在‘熱’的東西將像時尚一樣過去，只有真正有功能的、可訪問的、具有市場的、有用的才會存在。”

—“你將不必為獲取信息而搜索web。只要定義你想要的和收集這些東西所用的web就可以坐等其成了，比如：我作為一名消費者，定義了我想購買的一臺顯示器。這個信息將被潛在的商品提供商所發布或者收集。而他們會提供給我產品信息，使我輕松地購買他們的產品。”

—“以我的觀點看，未來（web3.0時代？）會關注內容、非功能性。這個站點可以提供給訪問者到達最深層內容的最輕松的訪問。而其它任何網站，包括復制其它站點做法的跟風（copy-cat）站點將繼續走老路。”

—“Fragrant網站采用XHTML2.5來驅動安裝在手機和PDA的USB棒或者植入到SD卡中的信息素散發器。在數碼相機上安裝可捕捉味道的擴展卡，拍照的同時還捕捉到了味道，這難道不是為網絡上的圖片又增加了一個新特性嗎？在看食物圖片的同時，聞一下味道如何？然后在餐廳預定一下位置？哇，全新的平面+嗅覺廣告！”

—“我相信現在網絡連接的速度這么快，像video這樣的東西可以應用在電子商務網站和服務網站。直接和你的顧客面對面地交流、贏得他們的信任，讓他們知道你是誰。”

—“搜索引擎將代替web和web的內容！越來越多的搜索引擎和目錄會保存web站點的內容，這樣就沒有人需要去真正的網站。”

—“在web領域的下一件大事是建立家族（或者繼承）的門戶（portal），家族成員或者繼承人在那里一起建立一個家族站點。這些站點維護家族信息——以數字格式保存家族成員姓名、財產、相片等。這樣，全球氣候不會破壞或者抹去整個家族的記憶——它將被安全地保存在冗余服務器上，并供奉在‘家族拱頂’頁面上。你將擁有關于自己家族和成員之間相互關系的巨大數據池。無論這個家族是否都居住在同一座城鎮、州縣或者同一個國家、甚至同一個星球上，通過照片和簡介上的鏈接可以直接獲得相關信息。很cool吧！另外，可建立一個收費的服務：通過發送的口腔采樣藥簽（mouth swabs）來獲得與之匹配的家族成員的DNA序列。并且保存這些信息用來進行DNA比對等不時之需…”
}


cleverpig的Idea：

????????1．XM傳輸協議取代傳統的HTTP：“老舊的HTTP已經完全過時，它會被XMTP（eXtensible Markup Transport Protocol）所替代。這種XMTP是專為傳輸XML和聚合而設計，在數據傳輸上突破了HTTP的瓶頸，而且更加安全。”

????????2．瀏覽器廠商制定“XML序列化/反序列化”標準：主流的瀏覽器將在接收XML后進行解析，將XML反序列化為支持JavaScript或者其它瀏覽器腳本語言的Object，使client直接讀取服務器push過來的數據，并將用戶的請求序列化發送到服務器。

????????3．訂閱模式將轉變為“推送”模式：聚合程序不再是單調的周期性查詢服務器，而是服務器上面維護一系列用戶訂閱列表，只要打開瀏覽器便可以及時看到自己的訂閱信息，無論何時何地，具備瀏覽器和訪問網絡能力即可。并且這些消息會跟隨服務器的update而被push到client，有效地保證了信息的及時性。建立上文提到的FeedMesh之上的聚合服務器，專門提供信息檢索、訂閱、推送，接收結構化Blog提交的新信息。

????????4．瀏覽器更加智能：不但應有設備范圍被擴充到移動設備、電器，而且更加智能。比如可以通過設置電冰箱的購買策略，使其在食品放入時通過RFID掃描其條形碼，記錄過期時間，并制定提醒功能，而在庫存量不足時在通過主人確認后自動發送給雜貨店的訂貨單。

相關資源：

SitePoint&Ektron的2006/2007web開發狀況報告

極限編程組織官方網站

Javaeye的《ruby on rails為什么暫時無法成為企業應用開發的主流？》

Jasonkolb的《The Next Big Thing on the Web》

Knownow技術介紹

eweek的《2006年10大應該學習語言》


感謝閱讀此文

請支持cleverpig發起的