有了頁面緩存，Rails 就可以不再介入。在某種程度上，這是件好事，因?yàn)槟拇_可以獲得優(yōu)秀的性能。Rails 只需創(chuàng)建 HTML 頁面，將其放入目錄，之后，就可以置之于腦后。從那時(shí)起，就由應(yīng)用服務(wù)器管理這些頁面，且頁面進(jìn)入應(yīng)用服務(wù)器無需任何循環(huán)。從性能的角度而言，頁面緩存真是天賜之福。
我也鐘愛頁面緩存，Rails 使之簡單利落。只需使用一行代碼就可以啟用緩存。如果再加入一些代碼，就能通過簡單地刪除文件操作或使用 Rails 較高層的 API 終止緩存。這里存在一個(gè)問題。并不是每個(gè)網(wǎng)站都能使用頁面緩存。如果頁面上的數(shù)據(jù)會根據(jù)訪問它的用戶而改變，那么就不能進(jìn)行頁面緩存。而且，如果很難判斷頁面何時(shí)到期終止，就會發(fā)現(xiàn)頁面緩存的要求太過苛刻。
比如，幾乎在每個(gè)頁面上，ChangingThePresent.org（參閱 側(cè)欄）都有某些用戶數(shù)據(jù)是根據(jù)當(dāng)前登錄的用戶而變化的。圖 1 顯示了我們最新主頁的一部分。（我們一直在努力完善它，所以它有可能會改變。）這個(gè)頁面呈現(xiàn)出的問題相對簡單。如果能判斷用戶是否已經(jīng)登錄，就可以用 Flash、JavaScript、DHTML 或任何其他基于瀏覽器的代碼動(dòng)態(tài)定制視圖。您會發(fā)現(xiàn)已登錄的用戶可以登出系統(tǒng)或查看其配置文件，而已登出的用戶則可以注冊或再次登錄。
圖 1. ChangingThePresent.org 上的登錄和登出視圖
圖 2 顯示了稍微有些高級的用戶數(shù)據(jù)視圖，我們的站點(diǎn)就使用了這個(gè)視圖。圖 2 中的兩個(gè)視圖有極大的不同。為了處理頁面緩存，我必須先解決所有的差異。對于每個(gè)已登錄的用戶，我都必須替換掉頁面的登出內(nèi)容，使之顯示登錄用戶的登錄 ID 和用戶圖片。緩存這些內(nèi)容會帶來另一層面的挑戰(zhàn)，因?yàn)槊總€(gè)用戶的數(shù)據(jù)都不盡相同。
圖 2. 兩個(gè)截然不同的視圖
這種情況并非 ChangingThePresent.org 所獨(dú)有。如果需要個(gè)性化用戶體驗(yàn)，那么不可修改的 Rails 頁面緩存的使用就會受到限制。但如果定制不多，那么實(shí)際上還是能很容易地緩存這些頁面的。
解決這些問題的方法很多。我更傾向于使用如下這些技巧：
在這三種技巧中，我更喜歡第三種，因?yàn)榈谝缓偷诙N技巧都會將 Rails 應(yīng)用程序牽扯進(jìn)來。要獲得最大限度的可伸縮性，就要盡量多地使用靜態(tài)內(nèi)容。在本文中，我會側(cè)重于介紹第三種方式。請不要使用該方法存儲任何不能丟失的敏感數(shù)據(jù)，比如 ICBM 啟動(dòng)代碼或信用卡號。對于我們所處理的這些有限的數(shù)據(jù)而言，這種方法效果很好。
使用 Show and tell 還是 hide and seek？
在我剛開始試著緩存這個(gè)主頁時(shí)，我本可以簡單地用 JavaScript 替換這些鏈接。可以將這種技巧看成是 Show-and-tell。基于我們對已登錄用戶的了解，可以使用 JavaScript 選擇性地替換或注入 Web 頁的部分內(nèi)容，從而為用戶提供正確的體驗(yàn)。為了進(jìn)一步細(xì)分，我會進(jìn)行如下操作：
對于 ChangingThePresent 主頁而言，show-and-tell 技巧有些威力過度，因?yàn)槲抑挥袃商祖溄右鶕?jù)所登錄的用戶加以顯示。因此，我選擇了第二種技巧，我稱之為 hide-and-seek。首先，顯示出所有用戶的公共頁面元素，并通過每種數(shù)據(jù)可能 的隱藏版本顯示頁面的變化部分。這就是 hide 部分。然后，根據(jù)用戶的角色使用 JavaScript 在文件中找到該用戶的內(nèi)容并顯示出來。這就是 seek 部分。您可能會想，顯示所有可能數(shù)據(jù)的版本有點(diǎn)威力過度，實(shí)際上，選擇性地為不同的安全角色啟用多種特性時(shí)，這種方式是十分常見的。hide-and-seek 方式非常適合 ChangingThePresent 主頁。要實(shí)現(xiàn)這種方法，可以執(zhí)行如下操作：
實(shí)現(xiàn) hide and seek
對于 ChangingThePresent 主頁而言，hide-and-seek 實(shí)現(xiàn)起來異常簡單。在之前的圖 1 中，此主頁有一個(gè)部分顯示的是與用戶帳戶相關(guān)的一些鏈接。這些鏈接可以根據(jù)用戶是否登錄而變化。首要工作是構(gòu)建此頁的所有公共內(nèi)容。我在本文并未給出具體做法。第二頁需要顯示出所有用戶的全部動(dòng)態(tài)內(nèi)容，而不管用戶是否已經(jīng)登錄：
清單 1. 在單一視圖中創(chuàng)建動(dòng)態(tài)內(nèi)容的所有版本
<div id='logged_out'> <%= link_to "login", :controller => 'members', :action => 'login' %> <br /> <%= link_to "register", :controller => 'members', :action => 'signup' %></div><div id='logged_in' style="display: none;"> <%= link_to "your profile", :controller => 'profiles', :action => 'show' %> <%= link_to "logout" , :controller => "members", :action => "logout" %></div>
您可能已經(jīng)注意到 my profile 鏈接。起初，該鏈接指向用戶特定的配置文件，但這樣可能會妨礙我們的主頁緩存。相反，我只簡單地將此鏈接指向了無任何用戶 ID 的索引操作。然后，索引操作會將用戶重定向到正確的配置文件頁：
清單 2. 將用戶重定向到正確的配置文件頁
def index redirect_to my_profile_url end
在清單 2，my_profile_url 是一個(gè)方法，該方法可以根據(jù)用戶的類型（這可能是名人、顧問或會員）決定正確的配置文件 URL。每個(gè)用戶類型都有一個(gè)單獨(dú)的配置文件頁。這時(shí)，程序的功能已經(jīng)完成，您總共可以看到四個(gè)鏈接，logged_in 和 logged_out 各有兩個(gè)鏈接：
下一步，獲取含有當(dāng)前用戶類型的 cookie。對于 ChangingThePresent，我在登錄時(shí)創(chuàng)建了一個(gè) cookie，其中含有當(dāng)前的登錄 ID。之后，在登出時(shí)再銷毀這個(gè) cookie：
清單 3. 在登錄和登出時(shí)創(chuàng)建和銷毀 cookies
def login if request.post? self.current_user = User.authenticate(params['user_login'], params['user_password']) ... if logged_in? set_cookies ... endenddef logoutendprivatedef set_cookies cookies[:login] = current_user.login cookies[:image] = find_thumb(current_user.member_image)enddef logout cookies.delete :login cookies.delete :image ...end
在清單 3 中，logged_in? 是一個(gè)私有方法，如果當(dāng)前用戶已登錄則返回 true。上述的 Rails 方法會在您登錄時(shí)創(chuàng)建三個(gè) cookie，并在登出時(shí)刪除它們。這里不需要為數(shù)據(jù)費(fèi)神。尚且不需用到數(shù)據(jù)。可以這樣理解：無需調(diào)用 Rails 框架，我就可以判斷用戶是否登錄。我無需確保 cookie 到期終止是否與站點(diǎn)的到期終止規(guī)定相符。在我的例子中，二者是相符的，所以我現(xiàn)在盡可以開始頁面緩存了。
下一步，根據(jù)用戶的 cookie 選擇性地隱藏和顯示正確的條目。將如下的 JavaScript 代碼添加到 public/javascripts/application.js 中：
清單 4. 支持 show and hide 登錄 div 的 JavaScript 代碼
function readCookie(name) { var nameEQ = name + "="; var ca = document.cookie.split(';'); for(var i=0;i < ca.length;i++) { var c = ca[i]; while (c.charAt(0)==' ') c = c.substring(1,c.length); if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length); } return null;}function handle_cached_user() { var login_cookie = readCookie('login'); var logged_in = document.getElementById('logged_in'); var logged_out = document.getElementById('logged_out'); if(login_cookie == null) { logged_in.style.display = 'none'; logged_out.style.display = 'block'; } else { logged_out.style.display = 'none'; logged_in.style.display = 'block'; }}第一個(gè)函數(shù)從 Javascript 中讀取 cookie 值，第二個(gè)函數(shù)處理此 DOM。可以通過使用 Prototype 庫簡化這段代碼，但我包括了基本的 DOM 查找以便于讀者理解。最后一步是在頁面加載時(shí)調(diào)用 JavaScript 函數(shù)。我向布局中添加了如下代碼：
清單 5. 當(dāng)頁面加載時(shí)調(diào)用 JavaScript 函數(shù)
<script type="text/javascript"> window.onload = function() { handle_cached_user(); <%= render_nifty_corners_javascript %> <%= yield :javascript_window_onload %> } </script>上述 JavaScript 代碼十分簡單。在頁面加載時(shí)，將加載 handle_cached_user 函數(shù)，而它會相應(yīng)地顯示或隱藏正確的內(nèi)容。現(xiàn)在，我盡可以通過向控制器中添加如下代碼來啟用頁面緩存：
caches_page :index
上述代碼效果極佳。我還是需要定期地從緩存中刪除前頁，這樣我才能使該頁期滿終止。為此，我只需簡單地定期刪除 public/index.html。hide-and-seek 方式對于有幾類用戶的頁面十分有效，但對于如圖 2 中所示的用戶 partial 效果卻不佳。對于后者，需要綜合使用 hide-and-seek 和 show-and-tell 技巧。
實(shí)現(xiàn) show-and-tell
再來看看 圖 2。我將使用 hide-and-seek ― 根據(jù)用戶是否已登錄 ― 選擇 partial 的正確版本，然后使用 show-and-tell 技巧根據(jù)我之前在清單 3 的行 4 和行 5 中所寫的 cookies 的內(nèi)容填充頁面的動(dòng)態(tài)部分。請記住，對于 show-and-tell，我特別更改了頁面的元素以符合單個(gè)用戶的情況。
首先，完成在這兩個(gè) partial （即登出用戶和登錄用戶）上呈現(xiàn)的靜態(tài)內(nèi)容。我假設(shè)用戶已經(jīng)登出，所以我會通過附加 display: none 風(fēng)格隱藏 logged_in div。之后，如果必要，我就可以用 JavaScript 顯示或隱藏它們。請注意，我使用了相同的兩個(gè)名稱：logged_in 和 logged_out，來識別每個(gè) div，這樣便無需對我為這個(gè)主頁所編寫的 JavaScript 進(jìn)行修改：
清單 6. 呈現(xiàn)登錄和登出這兩個(gè) partial
<div class="boxRight sideColumnColor"> <div id='logged_in'> <%= render :partial => 'common/logged_in' style="display: none; %> </div> <div id='logged_out'> <%= render :partial => 'common/logged_out' %> </div></div>
接下來，完成 logged_in partial 的內(nèi)容。注意，每個(gè)包含動(dòng)態(tài)內(nèi)容的 HTML 組件都有一個(gè) ID，從而我可以使用 JavaScript 找到它并隨后將其替換：
清單 7. 顯示 logged_in partial
<div id='logged_in' style="display: none;"> <%= link_to %(<span class="mainBodyDark">Hi, </span>) + %(<span class="textLarge mainBodyDark"><b id='bold_link'>) + "my_login" + %(</b></span>), {:controller => 'profiles', :action => 'show', :id => 'my_login'}, {:id => 'profile_link'} %> <br/> <div id='picture_and_link'> <a href="http://member/my_login" id='link_for_member_thumbnail'> <img id='member_thumbnail' alt="Def_member_thumbnail" src="/images/default/def_member_thumbnail.gif" /></a> </div> <div id="not_mine">Not my_login?</div> <br/> <%= image_button "logout", :controller => "members", :action => "logout" %>如果對 Rails 有足夠的了解，您可能會注意到其中的幾個(gè)定制幫助程序函數(shù)。從中可以看到四處很明顯的動(dòng)態(tài)內(nèi)容，我需要使用 JavaScript 為每個(gè)加載的頁面替換這些內(nèi)容：三處登錄，一處會員圖像。此處的 JavaScript 代碼對 handle_cached_user 函數(shù)作了一處修改，并且還含有一個(gè)為動(dòng)態(tài)用戶處理頁面更新的方法。針對本文的具體情況，我稍微對這段代碼做了少許簡化。可以將如下函數(shù)添加到 application.js 文件中：
清單 8. 替換用戶 partial 的元素
function handle_user_partial() { var login_cookie = readCookie('login'); var image_cookie = readCookie('image'); var profileLink = document.getElementById('profile_link'); profileLink.href = '/member/' + login_cookie; document.getElementById('bold_link').firstChild.nodeValue=login_cookie; document.getElementById('not_mine').firstChild.nodeValue="Not " + login_cookie + "?"; document.getElementById('link_for_member_thumbnail').href="/member/" + login_cookie; document.getElementById('member_thumbnail').src=image_cookie.replace(/%2[Ff]/g,"/"); document.getElementById('member_thumbnail').alt=login_cookie;}在清單 8 中，這個(gè) JavaScript 函數(shù)首先讀取此 cookies 并獲取 DOM 樹的一部分：即到當(dāng)前的用戶配置文件的鏈接，稱為 profile_link。然后是 handle_user_partial 函數(shù)：
在 DOM 中導(dǎo)航時(shí)，會發(fā)現(xiàn)有時(shí)需要直接轉(zhuǎn)到 DOM 元素，而有時(shí)又需要轉(zhuǎn)到該元素的特定子元素，比如在處理文本的時(shí)候。我就使用了 firstChild 函數(shù)根據(jù)需要尋找 DOM 元素的第一個(gè)子元素。由于語法更為友好，所以 Prototype 庫使處理特定的 DOM 元素較為容易一些，但這超出了本文的討論范圍。
我已經(jīng)創(chuàng)建好了所有的 cookies，最后一步就是從 handle_cached_user 函數(shù)調(diào)用 JavaScript。請記住，該函數(shù)在 public/javascripts/application.js中：
清單 9. 將 handle_user_partial 函數(shù)添加到 handle_cached_user
function handle_cached_user() { var login_cookie = readCookie('login'); var logged_in = document.getElementById('logged_in'); var logged_out = document.getElementById('logged_out'); if(login_cookie == null) { logged_in.style.display = 'none'; logged_out.style.display = 'block'; } else { handle_user_partial(); logged_out.style.display = 'none'; logged_in.style.display = 'block'; }}請注意，else 條件中的 handle_cached_user 函數(shù)下面還有額外兩行代碼。這兩行代碼可以在使 logged_in DOM 元素可見之前進(jìn)行適當(dāng)?shù)奶娲ＪＯ滤枳龅木褪鞘褂帽酒恼潞?上個(gè)月 的那篇文章中所介紹的頁面緩存指令來緩存整個(gè)頁。
結(jié)束語
本篇文章中介紹的這種高級技巧為我們打開了許多方便之門。在 ChangingThePresent.org 上，我們估計(jì)使用非常簡單的基于時(shí)間的清除器能夠緩存超過 75% 的頁面。通過使用稍微有些復(fù)雜的清除技巧，我們就能緩存超過 90% 的頁面，而且還可能更多。如果您想試圖影響我們的圖像緩存計(jì)劃，那么您只能觸及應(yīng)用服務(wù)器 1% 到 3% 的 Web 請求。
但同時(shí)，我們也應(yīng)該看到不利的一面。我向此系統(tǒng)添加了明顯的復(fù)雜性。我必須維護(hù)更加復(fù)雜的 HTML 代碼，并確保 HTML 和 JavaScript 能夠保持同步。但好的一面是在需要獲得更好的性能時(shí)，我就能夠使用最為簡單和有效的緩存技術(shù)。您也可以嘗試使用這種技巧 ― 訪問 ChangingThePresent.org 并加載主頁。接下來，加載每個(gè)頂端的菜單。您會發(fā)現(xiàn)我們會頁面緩存六個(gè)頂端菜單中的四個(gè)。創(chuàng)建一個(gè)帳號并重載每一個(gè)菜單。您能猜到哪個(gè)頁面被緩存了么？在下一篇文章中，在繼續(xù)深入真實(shí)世界中的 Rails 的同時(shí)，我將帶您探究能增進(jìn) ActiveRecord 性能的一些技巧。
新聞熱點(diǎn)
疑難解答
圖片精選
