background.js

var myState = {
  counter: 0,
  greeted: false,
};

browser.tabs.onCreated.addListener(() => {
  myState.counter = 0;
});

browser.runtime.onMessage.addListener((message) => {
   switch(message) {
     case 'state':
       return myState;
     case 'greeted':
       myState.greeted = true;
       break;
     case 'increment':
       myState.counter += 1;
       return myState.counter;
   }
});

popup.js

function init() {
  browser.runtime.sendMessage('state')
    .then((state) => {
       document.getElementById('counter').textValue = state.counter;
       if(!state.greeted) {
         const greeting = document.createElement('p');
         greeting.textContent = 'hiya!';
         document.body.append(greeting);
         browser.runtime.sendMessage('greeted');
       }
    });
  document.getElementById('increment').addEventListener('click', () => {
    browser.runtime.sendMessage('increment')
      .then((newCount) => {
        document.getElementById('counter').textValue = newCount;
     });
  });
}
document.addEventListener('DOMContentLoaded', init);