Dot | PWA support

[lamersc-old]

So. Mozilla thought it was a good idea to remove PWA (progressive web app) support from Firefox. We shouldn't even be here right now but here we are. Why did they remove it you may ask? Ha if only anyone knew, it just really came from nowhere. So now, we need to figure out how to bring this crucial piece of web technology back. Let's get started, shall we?

Full screen and borderless

PWA applications are designed to be both full screen compatible and functional without need a browser border (such as search bar, task bar, etc). This is an issue, as the core PWA technology is not in Firefox currently (as far as I know). This issue could be handled pretty straight forward as to simply use the standard Firefox window and hide the wrappings around temporarily in that instance, giving the design of a PWA. This is pretty straight forward and easy to implement both natively (and possibly just through simple Mozilla JS itself).

Launching app and running offline

This is where things get more trickier. Launching the app seems pretty trivial as to just generate an icon that launches a specific URL in dot (would be programmed in) that opens the specified PWA window. Running offline though... I'd have to write it to understand it. For basic understanding, I'm thinking store files offline in a specified PWA folder, then when an application is launched, load in those PWA files into the browser, maintaining the sandbox and simplifying the design.

How will storage work if the PWAs can run offline? And what about notifications?

They can utilize technologies such as Web Storage API and IndexedDB API. Notifications can also be handled standardly through the base Notifications API which will require some tweaking for offline usage, but that's not important right now.

So. Web PWA's. It's going to a bit of work to implement the technology, but I feel the Dot team is more than willing too so that we may help push the future of the web and give users the convenience PWA's have to offer. After all, they can be used for games, list applications, canvas drawing tools, and much more. It all depends how the developers want to utilize them, and we're willing to work to allow this to happen.

If you have any questions, please leave a comment as this is a base implementation design. Things are possibly to change as development starts, so expect this write up to be updated 🙂.

• Chris L

[trickypr]

As a reference for any developer who ends up creating this, there is an existing userjs customization that does this that may be a good reference point.