2009-12-05 65 views
2

我試圖編寫一段代碼,它允許用戶將文本鍵入到文本框中,然後將其保存在服務器上。當用戶在文本框中鍵入更多文本時,我只想將區別發送到服務器。文本差異補丁

有沒有JS的差異算法,我可以使用它只發送有關差異的信息。所以它應該能夠從根本上區分兩個文本框。

它也可能是語言不可知的,我可以移植它。

謝謝你的時間。

UPDATE

在簡單的話。我有一個文本區域,每隔X秒不斷保存文本。現在爲了節省帶寬,我只希望它發送與上次保存的版本不同的內容(我可以將其放入一個變量中,最初這將是空的)。現在,JS必須檢查最後一個修訂版本和文本框當前狀態之間的差異,並生成發送到服務器的更改列表。

更新2

喜歡的東西www.etherpad.com

+0

作業?給你一個你想要的例子,但不清楚。 – 2009-12-05 09:29:42

+0

不不不,不是HW。用text => abc來說一個文本框。那麼textarea有textarea => abcXYZ。現在我只想將差異發送到服務器。 – 2009-12-05 09:31:46

+0

嗯,我得到了,但如果第一個包含abc然後adc,你會發送什麼 – 2009-12-05 09:32:46

回答

3

谷歌DiffMatchPatch有一個Javascript實現,我用它很成功。

http://code.google.com/p/google-diff-match-patch/

+0

+1我會建議一個,我也有它成功 – 2009-12-05 10:03:04

+0

http://stackoverflow.com/questions/1576050/network-efficient-difference-between-two-strings -in-javascript也有一些關於差異匹配補丁的真棒鏈接 – 2009-12-05 10:06:34

1

Python的difflib模塊做到這一點,更。這是非常靈活的,但可能很難轉移到Javascript。

關於您的更新,我首先想知道爲什麼您需要擔心帶寬。除非你的用戶在文本編輯框中輸入文本(它有自己的可用性問題),那麼就沒有那麼多字節要發送了。每次自動保存時發送整個文本框。用戶無法快速鍵入以真正注意到使用帶寬。

或者,你可以半途而廢。每次你自動保存時,檢查一下用戶是否只有新增加了新文字,與上次相比較。如果是這樣,只發送一個「追加」類型的更新只是新的文本。如果用戶返回並編輯了其他任何內容,則發送「替換」類型更新,在其中發送整個文本。這樣可以避免常見的追加事件,而不會嚴重影響實施。

+0

正在嘗試類似etherpad.com – 2009-12-05 09:47:09

0

而不是計算2個文本之間的差異,這是困難的,

你總是可以,當人們正在編輯工作,記錄鍵擊,並在文本框中插入符的位置。如果您現在每隔一段時間發送一次(並清理緩衝區),則服務器可以播放完全相同的序列。

0

這種過早優化的代碼味道。也許你應該先實施你的解決方案,然後然後看到關於使用差異優化你的傳輸速率。你看多少文字?由於請求和響應數據包的大小差不多相同,只有幾個字節的差異,所以節省可能非常小。

至少,無需優化即可完成解決方案,並使用Firebug等工具來分析您的網絡流量,然後測試,看看您認爲可以發送的最大文本塊的性能會有多糟糕。

最後,您始終可以使用TypeWatch JQuery plugin來偵聽文本框中的更改事件。您可以設置延遲時間,以便用戶完成打字並延遲後,觸發回調功能。這意味着文本只會在用戶鍵入內容時發送,並且只有在輸入完成後纔會發送。這將比重複輪詢服務器更有效。