87322

Slight loading delay with chrome extension popup

Question:

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.

<img alt="loading" class="b-lazy" data-src="https://i.imgur.com/xW5e1m6.png" data-original="https://i.imgur.com/xW5e1m6.png" src="https://etrip.eimg.top/images/2019/05/07/timg.gif" />

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?

Answer1:

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

Recommend

  • Load Same ACF Map Twice on Same Page
  • sweetalert2 inputoptions from file in select example
  • Fail:(TESTMODE) Transactions of this market type cannot be processed on this system
  • nodemcu custom firmware build problems
  • Regex to match a string not followed by anything
  • Symfony 2. CSRF token is invalid
  • c# open webrowser in many tab
  • Z3: Convert between FP and BitVector?
  • Textfile Structure (tables)
  • How to run “Deployd” on port 80 instead of port 5000 in webserver.
  • chrome.tabs.executeScript only fires when the Developer Console is open
  • Typescript - Unable to get 'import' statement to function
  • Meteor: Do Something On Email Verification Confirmation
  • Cannot resolve symbol 'MyApi'
  • MongoDB in PHP using aggregate to group by _id is null not working
  • Recording logins for password protected directories
  • How to get address from latitude and longitude android google map v2 [duplicate]
  • Java Scanner input dilemma. Automatically inputs without allowing user to type
  • Display issues when we change from one jquery mobile page to another in firefox
  • Is there any way to access browser form field suggestions from JavaScript?
  • Why doesn't :active or :focus work on text links in webkit? (safari & chrome)
  • what is the difference between the asp.net mvc application and asp.net web application
  • To display the title for the current loaction in map in iphone
  • jQuery tmpl and DataLink beta
  • Matrix multiplication with MKL
  • How to delete a row from a dynamic generate table using jquery?
  • Unit Testing MVC Web Application in Visual Studio and Problem with QTAgent
  • json Serialization in asp
  • SQL merge duplicate rows and join values that are different
  • Rails 2: use form_for to build a form covering multiple objects of the same class
  • trying to dynamically update Highchart column chart but series undefined
  • Proper way to use connect-multiparty with express.js?
  • using HTMLImports.whenReady not working in chrome
  • How to set the response of a form post action to a iframe source?
  • Angular 2 constructor injection vs direct access
  • Java static initializers and reflection
  • How to stop GridView from loading again when I press back button?
  • Android Google Maps API OnLocationChanged only called once
  • Binding checkboxes to object values in AngularJs
  • UserPrincipal.Current returns apppool on IIS