如何避免html5畫布在頁面刷新時刷新

在網頁中，我有一個html5畫布，他需要很多時間來初始化，一旦準備就緒，我想避免刷新它。目前在頁面刷新時，畫布是重新加載的形式，引入漫長的等待時間。如何避免html5畫布在頁面刷新時刷新

有沒有一種方法，即使是一種解決方法（「非文檔化的畫布屬性或保存到本地存儲技巧」），以避免這種情況？

2017-04-18 LaBracca

如果它只能在頁面刷新過程中生存，你可以使用'canvas.toBlob（b => localStorage.mycanvas = URL.createObjectURL（b））;'當你完成繪製時，'if localStorage.mycanvas）{let img = new Image（）; img.onload = E => ctx.drawImage（IMG，0,0）; img.onerrror = E => {localStorage.mycanvas = ''; defaultInit（）;} img.src = localStorage.mycanvas; } else {defaultInit（）};'**但是如果它總是相同的結果，爲什麼不直接在你的服務器上保存一個png版本？** – Kaiido

你可以使用LocalStorage緩存畫布，甚至可以節省一半在你的服務器上的畫布，所以加載時間會少很多，如果你找不到一種方法來減少時間你可以使用setTimeout和setInterval（和其他選擇），而不是for/while循環或甚至重計算併爲其添加加載。它需要更多的時間來完成，但至少會有很好的加載。 – moisrex

非常感謝。實際上我使用的是統一畫布，所以畫布不僅僅是一個圖像，而是一個完整的webgl引擎。順便說一句，如果有一個竅門，這將是一個偉大的專業人士，但似乎我需要以另一種方式工作 – LaBracca

我不知道如何避免刷新canva，因爲它違背了刷新頁面的基本思想，但是您是否考慮過在語言環境或會話存儲中緩存初始化數據？

參考https://developer.mozilla.org/en-US/docs/Web/API/Storage/LocalStorage

來源

2017-04-18 06:41:43 Shautieh

如何避免html5畫布在頁面刷新時刷新

回答

相關問題