Best Practices for Developing Lightweight, Performance-Friendly Firefox Extensions?

Add-ons
1

Hi all,

I’m currently exploring the idea of creating a small browser extension—nothing too complex, just something that improves basic productivity (like tab management or content filtering). I want to make sure it’s well-optimized and doesn’t introduce unnecessary background activity or memory usage.

For those of you experienced with Firefox WebExtensions:

  • Are there specific APIs or design patterns you’d recommend to keep the extension lightweight and resource-efficient?
  • How do you handle things like persistent background scripts vs event pages in Firefox?
  • Any tools or methods you use to profile performance impact during development?
  • Also curious how strict Mozilla is when reviewing for performance during submission to AMO.

I’d love to learn from others who’ve published extensions or experimented with lightweight builds. Any tips, resources, or lessons learned would be super helpful.

Thanks in advance!

2

It’s hard to say upfront what makes the addon fast/slow. It depends on the situation.

It also depends on the developer knowledge, for example do you know what a Set is and when/why to (not)use it? :slight_smile:

But there are some sure roads to hell, for example if you have a content script injected into every page and it’s size is above ~100KB. Or if it performs some super slow HTML operations, like calling getBoundingClientRect in a loop while making changes to the DOM.

I think Jake Archibald talked about some of these things here: SmashingConf London — Jake Archibald on ‘The Event Loop’

Regarding the non-persistent background pages, they solve memory issues - because you can’t have a memory leak if the process is terminated :smiley: .
But it’s a tradeoff. If your complex background script is gonna wake up every time you switch tabs or load a page, it’s gonna consume more of your CPU instead.
But yeah, non-persistent background scripts will be mandatory for everyone, so it’s best to use them already now. Current state (if needed) can be stored in browser.storage.local/session storage.

In general, it’s best not to overuse 3rd party libraries, or avoid them completely if possible. And if you do need them, make sure they are not loaded in contexts where they are not used. So background script shouldn’t load whole React library.

You can measure performance of your addon using the built in Profiler in Firefox, but it’s not exactly easy to read the report, so you better watch some tips and tricks videos.

I’m pretty sure Firefox addon teams doesn’t review performance of addons :smiley: , I have a feeling they are heavily understaffed with no time for such nonsense :smiley: .

1 Like