From 0a49cc45732175c65651b5f054c677d6c42a28c0 Mon Sep 17 00:00:00 2001 From: Stephen Blott Date: Mon, 18 Apr 2016 11:43:53 +0100 Subject: Cache content_scripts/vimium.css in chrome.storage.local. Previously, we had two different approaches. This seems like a simpler approach. We simply cache the Vimium CSS in chrome.storage.local (in the background page) and fetch it from there (in UI components). There is also a minor change in the we no longer cache the CSS in memory. This seems to be the right thing to do. Caching the CSS in memory consumes a small amount of memory. However, it can only speed up the fastest loads. It cannot speed up the first load -- which is likely the one that matters most. So caching the CSS in memory seems to make little sense. --- background_scripts/main.coffee | 14 +++++++------- content_scripts/ui_component.coffee | 29 +++-------------------------- 2 files changed, 10 insertions(+), 33 deletions(-) diff --git a/background_scripts/main.coffee b/background_scripts/main.coffee index 4aa2fc41..ab1c8610 100644 --- a/background_scripts/main.coffee +++ b/background_scripts/main.coffee @@ -129,14 +129,15 @@ helpDialogHtmlForCommand = (html, isAdvanced, bindings, description, showCommand html.push "", Utils.escapeHtml(bindings) html.push("") -# -# Fetches the contents of a file bundled with this extension. -# -fetchFileContents = (extensionFileName) -> +# Cache "content_scripts/vimium.css" in chrome.storage.local for UI components. +do -> + # Bail if we don't have these (specifically, we don't have them in the tests). + return unless XMLHttpRequest? and chrome.runtime.getURL? and chrome.storage.local.set? req = new XMLHttpRequest() - req.open("GET", chrome.runtime.getURL(extensionFileName), false) # false => synchronous + req.open "GET", chrome.runtime.getURL("content_scripts/vimium.css"), true # true -> asynchronous. + req.onload = ({status, responseText}) -> + chrome.storage.local.set vimiumCSSInChromeStorage: responseText if status == 200 req.send() - req.responseText TabOperations = # Opens the url in the current tab. @@ -417,7 +418,6 @@ sendRequestHandlers = gotoMark: Marks.goto.bind(Marks) # Send a message to all frames in the current tab. sendMessageToFrames: (request, sender) -> chrome.tabs.sendMessage sender.tab.id, request.message - fetchFileContents: (request, sender) -> fetchFileContents request.fileName # For debugging only. This allows content scripts to log messages to the extension's logging page. log: ({frameId, message}, sender) -> BgUtils.log "#{frameId} #{message}", sender diff --git a/content_scripts/ui_component.coffee b/content_scripts/ui_component.coffee index 1a7a1634..7422aada 100644 --- a/content_scripts/ui_component.coffee +++ b/content_scripts/ui_component.coffee @@ -5,7 +5,6 @@ class UIComponent iframeFrameId: null options: null shadowDOM: null - styleSheetGetter: null toggleIframeElementClasses: (removeClass, addClass) -> @iframeElement.classList.remove removeClass @@ -18,10 +17,9 @@ class UIComponent # Default to everything hidden while the stylesheet loads. styleSheet.innerHTML = "iframe {display: none;}" - # Use an XMLHttpRequest, possibly via the background page, to fetch the stylesheet. This allows us to - # catch and recover from failures that we could not have caught when using CSS @include (eg. #1817). - UIComponent::styleSheetGetter ?= new AsyncDataFetcher @fetchFileContents "content_scripts/vimium.css" - @styleSheetGetter.use (styles) -> styleSheet.innerHTML = styles + # Fetch "content_scripts/vimium.css" from chrome.storage.local; the background page caches it there. + chrome.storage.local.get "vimiumCSSInChromeStorage", (items) -> + styleSheet.innerHTML = items.vimiumCSSInChromeStorage @iframeElement = DomUtils.createElement "iframe" extend @iframeElement, @@ -99,26 +97,5 @@ class UIComponent @options = null @postMessage "hidden" # Inform the UI component that it is hidden. - # Fetch a Vimium file/resource (such as "content_scripts/vimium.css"). - # We try making an XMLHttpRequest request. That can fail (see #1817), in which case we fetch the - # file/resource via the background page. - fetchFileContents: (file) -> (callback) -> - request = new XMLHttpRequest() - - request.onload = -> - if request.status == 200 - callback request.responseText - else - request.onerror() - - request.onerror = -> - chrome.runtime.sendMessage - handler: "fetchFileContents" - fileName: file - , callback - - request.open "GET", (chrome.runtime.getURL file), true - request.send() - root = exports ? window root.UIComponent = UIComponent -- cgit v1.2.3