diff --git a/assets/controllers/preview_controller.js b/assets/controllers/preview_controller.js index 0da34e6cb..286323c4b 100644 --- a/assets/controllers/preview_controller.js +++ b/assets/controllers/preview_controller.js @@ -12,6 +12,9 @@ export default class extends Controller { static targets = ['container']; static throttles = ['show']; + /** memoization of fetched embed response */ + fetchedResponse = {}; + connect() { useThrottle(this, { wait: 1000 }); @@ -43,6 +46,21 @@ export default class extends Controller { await this.show(event); } + async fetchEmbed(url) { + if (this.fetchedResponse[url]) { + return this.fetchedResponse[url]; + } + + let response = await fetch(router().generate('ajax_fetch_embed', { url }), { method: 'GET' }); + + response = await ok(response); + response = await response.json(); + + this.fetchedResponse[url] = response; + + return response; + } + async show(event) { event.preventDefault(); @@ -55,10 +73,7 @@ export default class extends Controller { try { this.loadingValue = true; - let response = await fetch(router().generate('ajax_fetch_embed', { url: event.params.url }), { method: 'GET' }); - - response = await ok(response); - response = await response.json(); + const response = await this.fetchEmbed(event.params.url); this.containerTarget.innerHTML = response.html; this.containerTarget.classList.remove('hidden');