AJAX 不是萬靈丹,取捨之間應妥善評估

大概是伴隨微軟 AJAX.NET 正式版上線後,開始有了各種講習、教育訓練、書籍等,慢慢的相關討論變得越來越多,有些東西我不覺得該用 AJAX ,但是還是很多人給他用下去,我覺得有點走火入魔了,就像什麼都改成什麼一樣,不是什麼應用都該改成 AJAX ,我想寫程式的人應該比較理性思考,不要盲從或是沉迷在某種技術下。

我個人以為,使用 AJAX 時應評估總資料量、傳輸量、重複取得的網路流量成本與時間成本。

  1. 連線上的潛在問題:AJAX 是新開一執行緒來取的資料,所以基本上 Session 不能共用,AJAX.Net 有包,讓 Server 能識別,這是包裝者的能耐,目前只看 Client 端使用者的部份。新開一執行緒時,另有潛在問題,IE 預設同時作用中的連線僅有 4 線,當網頁開很多、或是使用者其他網頁正在下載檔案、或是 xmlHttp 開很多時,AJAX 根本無法作用,就會死在那邊。此外每個連線還會有個初始連線時間,有些網路複雜的環境或是設定有問題的區域,可能初始連線時間會拖很久,間接造成效能不彰的感覺。
  2. 傳輸量:每個 http 的傳輸,除了資料內容外,必然有資料要求的 Request head 跟伺服器回應的 response head ,純 GET 的兩個資料頭合起來約在 500 bytes 以上,若是有 Cookies 或是 Post 動作,自然會更高。亦即,你若只傳個「你好」,事實上傳輸量是在 500 bytes 以上,而不是 4 bytes,這種情況不如直接由原先網頁輸出。此外,一般來說通用的元件設計會把 AJAX 輸出輸成 XML 格式,再包含 XML head 跟 xml 標籤,非字串的資料起碼膨脹四倍。
  3. 重複取得問題:在使用 AJAX 時,很多人喜歡在滑鼠動作上配合使用,但是滑鼠動作上配合使用可能會多次重複要求相同的內容,這就變成時間成本與網路資源的浪費,雖然說有快取,可能快取本身會節省部份時間,但這還是比較不佳的設計。
  4. 傳輸與等待:當透過 AJAX 要求資料,理所當然要等待,等待時間依據網路環境與資料量來決定,那麼就回過頭來看,哪種操作比較不在乎等待?哪種操作完全不希望等待?此外使用 AJAX 可以分成同步與非同步,非同步可以默默的更新,同步則一定要等待,假設每 3 秒更新聊天室的對話盒,假設取得資料時間是 3 秒,同步的狀況是每 5 秒你要發呆 3 秒,非同步則是訊息晚 3 秒顯示,但你卻感覺不到網路在連線。

另外舉個例子來說,假設一個樹狀目錄,每個項目的字數平均為 20 字,共 100 個項目,則樹狀目錄總傳輸量約為 100 * 20 * 2 = 4000 ,約在 4 kb 左右,若是像 MSDN 那樣設計,用 AJAX 將會十分不便,MSDN 左側樹狀目錄要用 AJAX 的原因是因為總資料量過大,超過 1 MB 以上,若不透過 AJAX 載入,反而會讓使用者每次目錄都要下載 1 MB ,網路流量、時間都浪費在這邊。但只有 4 kb 的樹狀目錄,我個人是認為不如直接初次載入就直接輸出,崁入一個 AJAX 的模組起碼也要 8 kb 以上,以為在節省傳輸量,實際上卻更增傳輸量,此外每次展開樹狀資料時,就要透過 AJAX 重新要求,除非你自己寫程式碼加入是否資料已載入的檢查,否則又在那邊浪費時間。

因此個人以為應該視網頁的應用方式及使用習慣,這種會影響重複傳輸、總傳輸量的東西一起納入評估,AJAX 有他的價值與應用的時機,他並非是萬靈丹,亦非是通用架構,使用上應配合系統瓶頸、效能改善時考量,寫著玩的範例、作業沒太大影響,但是真正崁入你設計的系統時,應審慎評估,不要搞成欲加速的系統反而變成減速,那就很蠢很好笑了。 

其他想像中可以應用的考量

一般來說,網頁傳輸時,需要傳輸 html head ,而 head 通常包含一堆 script 及 css ,以此網頁來說,若設計成初始載入即會輸出討論緒,後面的討論緒與連結改用 AJAX 更新,則閱讀每篇討論文章僅需要 10 kb 以內的流量,微軟的 logo 圖示也不會一直重複下載(當然,一般可能從本機快取讀),是有可能完成加速顯示,當然也會間接造成一些問題,比如說如何去直接定址一篇文章,以利後續討論引用或其他相關問題,或是在討論中連到其他網站後,返回上頁時如何回到目前內容。這只是一種應用的想法,但是這種想法是以減少流量為基礎來考量,並不是為了 AJAX 而硬套用 AJAX 。

當選用 AJAX 時,請自問,這是不是最好的選擇。

廣告
Categories: 技術分享 | 發表留言

文章分頁導航

發表迴響

在下方填入你的資料或按右方圖示以社群網站登入:

WordPress.com Logo

您的留言將使用 WordPress.com 帳號。 登出 / 變更 )

Twitter picture

您的留言將使用 Twitter 帳號。 登出 / 變更 )

Facebook照片

您的留言將使用 Facebook 帳號。 登出 / 變更 )

Google+ photo

您的留言將使用 Google+ 帳號。 登出 / 變更 )

連結到 %s

在WordPress.com寫網誌.

%d 位部落客按了讚: