Geek Answers Handbook

Chrome pop-up extension has a delay of 2 - 3 seconds

I have a list of todo Chrome extensions where all the code is in the content. There is nothing in background.js- mainly because I also deploy this application as a standalone website.

There is a 2 - 3 second delay between clicking on the extension browser action and a pop-up display. I believe, because Chrome waits before a lot of JS starts before showing a popup.

What is strange is that it loads instantly when I open the application as a tab (this is not a particularly heavy JS application!). This shows only mass delay as a popup.

Without fundamentally changing the architecture of my extension, is there a way to get some quick wins to improve pop-up download performance? What can i put off?

Here is my file manifest.json:

"background": {
  "page": "index.html"
},

"browser_action": {
  "default_icon": {   
    "19": "img/icon19.png",
    "38": "img/icon38.png"
  },

"default_title": "Super Simple Tasks",

"default_popup": "index.html?popup=true"
}

The application does several things in $(document).ready: setting the class on the body, putting some things in the console, checking the type of storage and checking if we have an Internet connection.

Note. If you prefer JavaScript, here is the compiled JS code that runs every time it loads. There is a little more than what I included below.

$(document).ready ->

  setPopupClass()

  standardLog()

  checkStorageMethod()

  checkOnline()

  $new_task_input = $('#new-task')
  $link_input = $('#add-link-input')

  initialize()

initialize then it configures the application: it receives an array of tasks and checks if it is empty, sends an event to Google Analytics, starts a migration from the old version, if necessary, displays tasks and does some DOM manipulation.

initialize = ->

    window.storageType.get DB.db_key, (allTasks) ->

      if allTasks == null
        allTasks = Arrays.default_data
        window.storageType.set(DB.db_key, allTasks)

      ga 'send',
      'hitType': 'event'
      'eventCategory': 'Data'
      'eventAction': 'Task count'
      'eventValue': allTasks.length

      Migrations.run(allTasks)

      Views.showTasks(allTasks)

      $new_task_input.focus()

      setTimeout (->
        $('#main-content').addClass('content-show')
      ), 150
+4
1

, , checkOnline() , . checkOnline(), Coffeescript:

checkOnline = ->
  online = navigator.onLine
  return online

, ( , ) -, JS :

$(document).ready ->

  setPopupClass()

  standardLog()

  checkStorageMethod()

  window.tourRunning = false

  document.onkeydown = keyboardShortcuts

  tour = createTour() # This is badwrong

  initialize()

  setTimeout (->

    checkOnline()

    changeEmptyStateImage(online)

  ), 100
+1

More articles:


All Articles