2012-01-28 39 views
3

我正在開發一個內部項目管理基於Web的應用程序,需要支持移動設備以及桌面。WURFL與PHP中的響應式設計相關的開銷

它是用Symfony2,jQuery,HTML5構建的。

使用WURFL與服務器端和客戶端的響應式設計相比,是否有任何性能比較?具體來說,我正在考慮渲染時間,HTTP調用(這是AJAX沉重)。

+0

響應式設計? – emaillenin 2012-01-28 17:08:13

+0

@emaillenin根據媒體查詢和屏幕分辨率,一個CSS文件意義上的響應式設計不同,而不同於基於瀏覽器和用戶代理的不同CSS文件。 – 2012-01-28 17:28:43

回答

4

性能敏感的響應式設計將整個負載放置在客戶端上,因此您應該通過在許多設備上進行測試來確保其正常工作。並非所有的智能手機都是相同的 - 有些CPU速度較慢,導致JavaScript代碼和媒體查詢速度緩慢。總的來說,使用服務器端代碼可以爲客戶帶來更輕鬆的體驗,同時還可以讓您對體驗進行更精細的控制。

但是在考慮這方面的性能方面之前,您應該考慮這種方法是否能夠提供足夠的移動體驗。還有,你應該向往網站的移動版本的兩個重要方面:

  • 一個上下文相關經驗的 - 它應該能夠提供一個 適當的體驗使用移動設備的人。這可能是 與 桌面上相同服務的適當體驗完全不同。請注意,使用移動設備並不一定意味着移動設備 - 移動設備用戶通常在物理上不可移動,但用戶 可能更喜歡在使用移動設備時以不同方式與您的站點或服務進行交互。隨着我們與網絡互動方式的增加, 上下文相應的體驗的重要性正在顯着增加:在您交互的電視瀏覽器上,似乎適合在筆記本電腦上使用的 完全不正確與 從一個房間。
  • A 設備敏感體驗 -it應該是 能夠提供在您的網站客戶使用的設備 上運行良好的體驗。這種可尋址設備的範圍是 ,隨着時間的增加而不斷增加,並且從功能 電話到電視機的發展更加多樣化。有些靠近臉部,其他的靠近 與房間相互作用。 幾乎不可能在如此寬範圍的設備上提供令人滿意的體驗,每個設備都有其自己的輸入/輸出限制和約定, 而無需爲設備定製體驗。主要的互聯網品牌敏銳地意識到這一點,並做了更多的事情,甚至可能顯然是 - 即使看似簡單的谷歌主頁掩蓋了不同的代碼,幕後服務於不同設備用於 實現跨設備的有用體驗景觀。

作爲提供桌面和移動網站的手段,但是,響應式設計在提供理想移動網站的所需方面方面不足。

  • 不管,因爲它 提供的設備,人們使用(此限制可能不適合與限制 使用情況的網站的一個問題)
  • 它可以是 同樣遭遇它不能提供一個上下文相關工作經驗由於核心技術限制了可瞄準智能手機和其他高端設備的設備範圍 ,因此僅將設備敏感體驗提供給有限範圍的設備。對於所有網站而言,可尋址設備的單一體驗適用性問題和有限範圍可能不是問題 - 一些網站 不適合移動特定的體驗,並且同樣地 某些網站所有者可能沒有願望爲廣泛的 設備提供服務。

值得注意的是響應式設計,對移動搜索引擎優化的未知影響,因爲目前尚不清楚是否不是搜索引擎將標識內容爲可移動設備,並在移動搜索相應的排名吧。

3

可以在服務器端確定並執行的任何邏輯都可以減少數據傳輸和客戶端開銷。減少發送內容的大小 - 例如相關的CSS,JavaScript,HTML和優化的圖像 - 顯然會減輕客戶的負擔。

一個基於RESS的解決方案(即響應式設計+服務器端組件 - http://www.lukew.com/ff/entry.asp?1392)將始終有機會更快地實現響應式設計解決方案。您總是需要考慮「更快」的意義,但是當我看到(可能設計不佳)的響應式設計站點向移動設備提供1Mb以上的內容時,他們可以通過一些服務器端智能獲得性能優化是巨大的。關於爲什麼網站的性能來自gomez @http://www.gomez.com/resources/whitepapers/why-web-performance-matters/以及爲什麼每一秒都很重要的好白皮書。

有關服務器端功能檢測如何提供幫助的幾個示例列在http://www.opendeviceknowledge.com/discovery上,包括響應式設計和服務器端世界可以一起玩的方式。

2

WURFL發明家,在這裏。羅南克雷明似乎已經相當廣泛地解決了這個問題。在一天結束時,是一個可用性與成本(開發與維護)的問題。

我想指出的唯一一件事是WURFL和響應式網頁設計不需要是獨立的世界。 Thisthis帖子有我對這個問題的看法。

更有趣的是,我們最近推出了一項服務,使得一些WURFL也可供Javascript開發人員免費使用。我建議你退房http://wurfl.io/網站。

簡而言之,如果導入一個微小的JS文件:

<script type='text/javascript' src="//wurfl.io/wurfl.js"></script> 

,你將留下一個JSON對象,看起來像:

{ 
"complete_device_name":"Google Nexus 7", 
"is_mobile":true, 
"form_factor":"Tablet" 
} 

(這是假設你使用的是Nexus 7,當然),你將能夠做這樣的事情:

if(WURFL.form_factor == "Tablet"){ 
    //dostuff(); 
} 

這就是你要找的東西。

謝謝