自拍偷在线精品自拍偷,亚洲欧美中文日韩v在线观看不卡

服務(wù)器端生成的 JavaScript 響應(yīng)

開發(fā) 前端
Basecamp中的大多數(shù)Ajax操作都是在處理服務(wù)器生成的JavaScript響應(yīng)(SJR)。它的工作原理是這樣的。

Basecamp中的大多數(shù)Ajax操作都是在處理服務(wù)器生成的JavaScript響應(yīng)(SJR)。它的工作原理是這樣的:

  1. 表單通過一種XMLHttpRequest驅(qū)動的形式提交。
  2. 服務(wù)器創(chuàng)建或更新模型對象。
  3. 服務(wù)器生成包含了針對該模型對象的更新了的HTML模板的一個JavaScript響應(yīng)。
  4. 客戶來評估處理由服務(wù)器返回的JavaScript,然后會更新DOM。

這種簡單的模式有一些重要的優(yōu)勢。

優(yōu)點#1:重用模版而不影響性能

無論是第一次渲染和隨后的模版更新,你都可以重用模版.如果使用Rails,有一部分技術(shù)像郵件/信息用于這兩種情況。

如果你只返回JSON格式的信息,你得用你的模版將展示這些信息兩次(一次是服務(wù)器端的第一次回應(yīng),一次是客戶端隨后的更新)—除非你做一個單一面頁的JavaScript app,這個app的第一次回應(yīng)是用JSON/客戶端生成方式。

后面那種方式會很慢,因為要等整個的Javascript庫load完并在客戶端生成好模版你才能看到效果(這是Twitter早期所用的方式,但隨后被背棄)。但至少在某些情況下這是一個合理的選擇而且不需要多個模版。

優(yōu)勢 #2: 客戶端需要更少的計算性能

雖然嵌入HTML模板的JavaScript可能造成響應(yīng)數(shù)據(jù)量比JSON格式的響應(yīng)要多(盡管用gzip壓縮后幾乎可以忽略),但是這不需要客戶端去做很多的運算來更新頁面。

這意味著,從端到端的觀點出發(fā),處理 JavaScript+HTML的響應(yīng)數(shù)據(jù)的速度,應(yīng)該比處理帶有客戶端模板性質(zhì)的JSON數(shù)據(jù)要快,至于快多少,取決于客戶端模板的復(fù)雜程度,以及客戶端計算性能。而且這個速度應(yīng)該是二倍關(guān)系,因為,服務(wù)器生成的模板可以通過緩存在多個用戶之間共享(詳見 Russian Doll緩存)。

優(yōu)勢 #3: 容易跟蹤執(zhí)行流

使用SJR會讓跟蹤執(zhí)行流變得非常容易。請求的機制是標準化的,是會帶有輔助邏輯“likeform_for @post, remote: true”. 當然沒有必要對于每個動作都帶上輔助邏輯。 接著控制器會以渲染完整視圖的方式來渲染響應(yīng)中的部分視圖,其中的目標只能是JavaScript 而不是完全的HTML

完整示例

0)首先使用消息模板

  1. <h1>All messages:</h1> 
  2. <%# renders messages/_message.html.erb %> 
  3. <%= render @messages %> 

1) 以Ajax方式提交表單.

  1. <% form_for @project.messages.new, remote: true do |form| %> 
  2.   ... 
  3.   <%= form.submit "Send message" %> 
  4. <% end %> 

2) 服務(wù)器創(chuàng)建模型對象.

  1. class MessagesController < ActionController::Base 
  2.   def create 
  3.     @message = @project.messages.create!(message_params) 
  4.  
  5.     respond_to do |format| 
  6.       format.html { redirect_to @message } # no js fallback 
  7.       format.js   # just renders messages/create.js.erb 
  8.     end 
  9.   end 
  10. end 

3) 服務(wù)器產(chǎn)生內(nèi)嵌入HTML的JavaScript響應(yīng).

  1. <%# renders messages/_message.html.erb %> 
  2. $('#messages').prepend('<%=j render @message %>'); 
  3. $('#<%= dom_id @message %>').highlight(); 

最后評估響應(yīng)工作是由form_for產(chǎn)生的XMLHttpRequest-powered表單來自動處理的。視圖因此由于新消息而更新,此外新消息也通過JS/CSS動畫高亮顯示

超越RJS

當我們一開始使用SJR時我們將它和一個叫做RJS的前身一起使用,使用RJS你需要寫Ruby模板,然后再將它們轉(zhuǎn)變成JavaScript。它是Coffeescript(或Opalrb,如果你喜歡的話)的簡化版,它錯誤地讓許多人舍棄了SJR模式。

現(xiàn)在我們不使用RJS了(更迭的原因通常很簡單——優(yōu)勢不是那么大,只有極少數(shù)情況下才需要的沒有必要那么復(fù)雜),但我們卻一如既往地致力于SJR。

這并不意味著JSON數(shù)據(jù)在服務(wù)器端產(chǎn)生和視圖在客戶端形成的模式一無是處。對于我們的UI需要很高的保真度的時候,以及像日歷這樣的,有大量的視圖狀態(tài)需要維護的時候,這樣的模式還是非常合適的。當需要走這條路的時候,我們使用Sam的卓越 Eco template system (認為ERB對于CoffeeScript).

如果你的網(wǎng)絡(luò)應(yīng)用都是高保真度的UI,那么走上面提到的那個路子是完全沒有問題的。只是你正在花費高價給自己購買些花哨的東西,不過這算是個問題。但是如果你的應(yīng)用有點像Basecamp或者Github這樣網(wǎng)絡(luò)上的以文本為基礎(chǔ)的主流應(yīng)用,那么你完全應(yīng)該張開雙臂擁抱SJR

 Russian Doll-caching, Turbolinks 和 SJR的融合簡直就是一杯難以置信的給力雞尾酒。它可以創(chuàng)造出快速的,現(xiàn)代化的,而且非常優(yōu)美的代碼類的網(wǎng)絡(luò)應(yīng)用,好好享用吧!

原文鏈接:https://37signals.com/svn/posts/3697-server-generated-javascript-responses

譯文鏈接:http://www.oschina.net/translate/server-generated-javascript-responses

責任編輯:陳四芳 來源: 開源中國編譯
相關(guān)推薦

2010-03-23 10:04:00

JavaScript

2011-09-08 10:21:50

Node.js

2018-06-07 10:45:41

瀏覽器服務(wù)器響應(yīng)

2011-07-26 11:07:08

JavaScript

2009-06-06 19:13:48

服務(wù)器端動態(tài)生成gif服務(wù)器端動態(tài)生成jpg

2012-10-15 13:40:15

IBMdw

2014-01-15 10:06:30

vFlash

2010-01-08 13:48:51

JSON 形式

2010-08-27 10:23:26

DHCP服務(wù)器

2014-11-14 11:03:56

微軟.NET

2023-06-30 08:00:00

漏洞網(wǎng)絡(luò)安全SSTI

2017-12-06 22:29:53

2011-06-07 16:01:46

Android 服務(wù)器 數(shù)據(jù)交互

2015-11-04 14:14:56

HTTP網(wǎng)絡(luò)協(xié)議

2009-07-06 17:22:54

JSP服務(wù)器

2022-05-07 15:54:56

小熊派鴻蒙

2021-07-27 06:14:32

服務(wù)器端移動端性能測試

2009-02-16 16:30:23

OperaTurbo服務(wù)器

2010-04-21 13:18:33

RAC負載均衡配置

2010-05-27 18:49:38

SVN入門
點贊
收藏

51CTO技術(shù)棧公眾號