• Rails 3：提高Ajax應(yīng)用速度

• http://developer.51cto.com??2011-05-18 09:45 ?Stefan Siebel ?51CTO??我要評(píng)論(0)

• 我建立了一個(gè)列表網(wǎng)站，ListKungFo，其中大量使用了Ajax，目前為止網(wǎng)站運(yùn)行非常良好。而過(guò)去兩周里，我一直在尋找一些能夠進(jìn)一步提高UI性能的方法，現(xiàn)在寫出來(lái)和大家分享。

【51CTO.com 5月18日外電頭條】而過(guò)去兩周里，我一直在尋找一些能夠進(jìn)一步提高UI性能的方法，得到的成果主要是返回正確的HTTP狀態(tài)代碼，優(yōu)化瀏覽器的緩存功能。

51CTO推薦專題：Ruby On Rails開發(fā)教程

具體地說(shuō)，會(huì)返回兩種狀態(tài)代碼：

◆ 返回200-“Ok”，這告知瀏覽器服務(wù)器能夠成功的對(duì)請(qǐng)求進(jìn)行響應(yīng)。響應(yīng)包含了從服務(wù)器返回的HTTP載荷中的數(shù)據(jù)。

◆ 返回304-“Not modified”，表示未修改，這告知瀏覽器所發(fā)出請(qǐng)求中的數(shù)據(jù)并沒(méi)有改變，因此可以從緩存中裝載數(shù)據(jù)。這種情況下，響應(yīng)不包含HTTP載荷。

既然“Not modified”消息包含的數(shù)據(jù)要少得多(沒(méi)有內(nèi)容，只有頭)，這樣你就最好返回到瀏覽器這里，當(dāng)然你需要先確保瀏覽器的緩存中已經(jīng)存在數(shù)據(jù)了。

在我的應(yīng)用中，我發(fā)現(xiàn)服務(wù)器返回的200-響應(yīng)比304-響應(yīng)要多得多。這造成了兩方面的問(wèn)題：

◆ 不得不傳輸比所需的更多的數(shù)據(jù)

◆ UI不得不處理更多數(shù)據(jù)

這兩方面出現(xiàn)的問(wèn)題都會(huì)讓應(yīng)用的速度變慢。雖然只是慢了一點(diǎn)，但在UI端還是足夠讓人察覺(jué)到了。幸運(yùn)的是你只需要對(duì)Rails應(yīng)用做幾個(gè)小修改，就能獲得應(yīng)有的效果。

1在GET方法中使用stale?語(yǔ)句

def?show ?

??@list_item?=?@list.list_items.find(?params[?:id?]?) ?

??if?stale?(?:etag?=>?@list_item,?:last_modified?=>?@list_item.updated_at.utc,?:public?=>?true?) ?

????respond_with(?@list_item?) ?

??end ?

end ?

stale?語(yǔ)句會(huì)通過(guò)響應(yīng)發(fā)送回一個(gè)etag與一個(gè)last_modified日期。如果下一個(gè)請(qǐng)求是相同的URL，那么瀏覽器會(huì)把這個(gè)etag和last_modified日期發(fā)送給服務(wù)器。然后stale?方法會(huì)對(duì)這兩個(gè)參數(shù)進(jìn)行分析，如果內(nèi)容相同，則返回304，如果出現(xiàn)參數(shù)值不同，那么說(shuō)明有新的內(nèi)容，這樣返回200。

想知道更詳細(xì)的stale?方法的用法，可以查閱Rails的API文檔，以及閱讀Rails的手冊(cè)。

2 確保瀏覽器對(duì)每次請(qǐng)求都接收新的數(shù)據(jù)

上面的修改完成后，發(fā)生了一些有趣的事情。在很短的時(shí)間內(nèi)，相同的Ajax行為被觸發(fā)了許多次，而瀏覽器并沒(méi)有向服務(wù)器發(fā)送一次請(qǐng)求，而都是從緩存中取得數(shù)據(jù)。雖然顯然讓UI變得快了很多，但這并不完全是我所想要的。我的目標(biāo)是獲得最佳的性能，同時(shí)還要保證屏幕上出現(xiàn)正確與最新的數(shù)據(jù)。

瀏覽器的緩沖行為受到了三個(gè)HTTP頭的flag狀態(tài)的影響：cache-controll、pragma和expires

想要關(guān)閉瀏覽器的緩存功能，你可以發(fā)送下面的代碼：

def?set_cache_buster ?

????response.headers["Cache-Control"]?=?"no-cache,?no-store,?max-age=0,?must-revalidate" ?

????response.headers["Pragma"]?=?"no-cache" ?

????response.headers["Expires"]?=?"Fri,?01?Jan?1990?00:00:00?GMT" ?

??end?

然而我想要做的是這樣：

def?set_must_revalidate ?

????response.headers["Cache-Control"]?=?"must-revalidate" ?

??end?

因?yàn)檫@么做可以讓瀏覽器在每次請(qǐng)求時(shí)檢查新加入的和被更新的數(shù)據(jù)，我在我的application_controller.rb中添加了這個(gè)方法，并且在before_filter控制器中加以調(diào)用。

3在返回集合的GET方法中使用stale?(例如索引)

上面的stale?例子是從控制器的show方法中取出的，這是網(wǎng)絡(luò)上非常通用的做法。如果想要使用這個(gè)方法返回一個(gè)集合，比如一個(gè)典型的控制器索引方法，那么需要想辦法找出當(dāng)前的集合和上次請(qǐng)求中的是否相同。

我的ListKungFu網(wǎng)站有一個(gè)類型列表List，其中包含很多ListItem。每個(gè)ListItem從屬于一個(gè)List。為了在list_items_controller中找出某個(gè)ListItem集合是否有變化，我添加了名為list.updated_at的時(shí)間戳，每次寫入操作時(shí)都會(huì)更新。

在ListItem.rb中：

class?ListItem?<?ActiveRecord::Base?

??belongs_to?:list ?

??after_save?:update_list ?

??after_destroy?:update_list ?

? ?

??#?[...] ?

? ?

??def?update_list ?

????self.list.updated_at?=?Time.now ?

????self.list.save ?

??end ?

end?

這樣，list_items_controller的索引方法看上去就像這樣：

def?index ?

????@list_items?=?@list.list_items ?

? ?

????if?stale?(?:last_modified?=>?@list.updated_at?) ?

??????respond_with(?@list_items?) ?

????end ?

??end?

如果不使用updated_at字段，我也可以給List模型加上一個(gè)version字段，但這樣看起來(lái)沒(méi)什么必要。如果這個(gè)模型不適合你的應(yīng)用，那么你需要找到另一種方法，檢查集合是否被修改了，比如計(jì)算一下集合中所有對(duì)象的校驗(yàn)和，這也能行得通。

Rails 3.0 主要改進(jìn)內(nèi)容：

1. New Active Record query engine

示例代碼：

users?=?User.where(:name?=>?"david").limit(20) ?

users.where("age?>?29") ?

#?SELECT?*?FROM?users ?

#?WHERE?name?=?"david"?AND?age?>?29? ?

#?ORDER?BY?name ?

#?LIMIT?20 ?

users.order(:name).each?{?|user|?puts?user.name?} ?

2. New router for Action Controller

示例代碼：

resources?:people?do ?

??resource?:avatar ?

?

??collection?do ?

????get?:winners,?:losers ?

??end ?

end ?

?

#?/sd34fgh/rooms ?

scope?':token',?:token?=>?/\w{5,5}/?do ?

??resources?:rooms ?

end ?

?

#?/descriptions ?

#?/pl/descriptions ?

#?/en/descriptions ?

scope?'(:locale)',?:locale?=>?/en|pl/?do ?

??resources?:descriptions ?

??root?:to?=>?'projects#index' ?

end?

3. New Action Mailer

示例代碼：

class?Notifier?<?ActionMailer::Base?

??default?:from?=>?

????"Highrise?<system@#{APPLICATION_DOMAIN}>"? ?

?

??def?new_project(digest,?project,?person) ?

????@digest,?@project,?@person?=?digest,?project,?person ?

?

????attachments['digest.pdf']?=?digest.to_pdf ?

????attachments['logo.jpg']???=?File.read(project.logo_path) ?

?

????mail( ?

??????:subject?=>?"Your?digest?for?#{project.name}", ?

??????:to?=>?person.email_address_with_name ?

????)?do?|format| ?

??????format.text?{?render?:text?=>?"Something?texty"?} ?

??????format.html?{?render?:text?=>?"Something?<i>textyi>"?} ?

????end ?

??end ?

end?

4. Manage dependencies with Bundler

5. 默認(rèn)啟用跨站點(diǎn)工具 XSS 保護(hù)

6. 告別字符編碼問(wèn)題困擾

7. Active Model: Validations, callbacks, etc for all models

8. 官方的插件 API

9. 內(nèi)部重構(gòu)

10. Agnosticism with jQuery, rSpec, and Data Mapper

11. 文檔完善?

Rails 是一個(gè)用于開發(fā)數(shù)據(jù)庫(kù)驅(qū)動(dòng)的網(wǎng)絡(luò)應(yīng)用程序的完整框架。Rails基于MVC(模型- 視圖- 控制器)設(shè)計(jì)模式。從視圖中的Ajax應(yīng)用，到控制器中的訪問(wèn)請(qǐng)求和反饋，到封裝數(shù)據(jù)庫(kù)的模型，Rails 為你提供一個(gè)純Ruby的開發(fā)環(huán)境。發(fā)布網(wǎng)站時(shí)，你只需要一個(gè)數(shù)據(jù)庫(kù)和一個(gè)網(wǎng)絡(luò)服務(wù)器即可。

【編輯推薦】

程序員的另類境界:Rails創(chuàng)始人駕保時(shí)捷參加職業(yè)賽

在Nginx上運(yùn)行Ruby on Rails

解讀Ruby on Rails的成功秘籍

Twitter從Rails遷移到了Java

基于Ruby On Rails開發(fā)高品質(zhì)Web應(yīng)用

轉(zhuǎn)載于:https://www.cnblogs.com/ToDoToTry/archive/2011/10/11/2207247.html

總結(jié)

以上是生活随笔為你收集整理的Rails 3：提高Ajax应用速度的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。