CODEWITHSUNDEEP
javascripthtmlgoogle-chrome-extensionpopup
Eric Gao
Eric Gao

Reputation: 3538

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.

loading

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?

Upvotes: 1

Views: 1247

Answers (1)

seaside
seaside

Reputation: 11

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

Upvotes: 1

Related Questions