Slight loading delay with chrome extension popup

问题

For some reason, I have a very small delay when I click my extension before the popup is loaded.

It's a 1-2 second hiccup before the popup displays, while all my other extensions display the popup html immediately.

As you can see above, there is even the loading cursor animation when I click the popup, which never happens for the other extensions.

Here is my popup html:

<!doctype html>
<html>
  <head>
    <script type="text/javascript" src="popup.js"></script>
    <title>Add a website to block</title>
  </head>
  <body>
    <form id="addWebsiteForm">
    Website Address: <input type="text" id="websiteAddress"><br>
    <input type="submit" value="Add Website">
    </form>
  </body>
</html>

My popup.js

var addWebsiteForm;

document.addEventListener('DOMContentLoaded', function(){
  addWebsiteForm = document.getElementById("addWebsiteForm");
  addWebsiteForm.addEventListener('submit', addWebsite);
});

function addWebsite(event) {
  event.preventDefault();
  var websiteAddressInput = document.getElementById("websiteAddress");
  var websiteAddress = websiteAddressInput.value;
  var storedWebsites;

  chrome.storage.local.get('websites', function(objects) {

    if (!objects.websites) {
        storedWebsites = [];
    } else {
        storedWebsites = objects.websites;
    }

    storedWebsites.push({'address':websiteAddress});
    chrome.storage.local.set({'websites':storedWebsites});
    addWebsiteForm.reset();
    websiteAddressInput.focus();
  });
}

And my manifest:

{
  "manifest_version": 2,

  "name": "Quizlet Extension",
  "description": "Go through your flashcards before moving onto a website",
  "version": "1.0",

  "options_page":"options.html",

  "browser_action": {
    "default_icon": "icon.png",
    "default_popup": "popup.html"
  },

  "permissions": [
    "storage"
  ]
}

Any ideas?

回答1:

I think you can try to add the background params to the manifest :

{
  ...
  "background": {
    "page": "background.html",
    "persistent": true
  },
  ...
}

Of course, need add a simple html file to the extension folder :

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
  </head>
  <body>
  </body>
</html>

Now open the Chrome Extension will be quickly without no delay.

The background page will be run all the time, it is always used to show notification.So we can make use of this feature, need't reopen the Extension which is the main reason of delay

来源：https://stackoverflow.com/questions/26640666/slight-loading-delay-with-chrome-extension-popup

标签

javascript

html

google-chrome-extension

popup