PWA Builder new team & new directions

David Rousset
PWABuilder
Published in
5 min readDec 6, 2019

Recently, there’s been some changes in the PWA Builder open-source project. Jeff Burtoft, the creator of this great project, asked me to take the lead of his baby as he’s getting more responsibilities and side projects to manage. As the co-creator of the open-source engine Babylon.js, I know how hard it is to leave your little favorite toy behind you. I’ve stopped contributing to Babylon.js for a bit more than one year, it was hard for me to turn the page. I’ll then try to take care of PWA Builder in the best way possible! Jeff is still following the project obviously and provides great feedback. Justin Willis was the main contributor and maintainer of PWA Builder during the last year. I’d like to thank him for all the efforts he’s been doing! I know working alone on such a big project could be sometimes difficult.

Let me present the new team in place:

- Justin Willis is still a core developer of PWA Builder and a huge fan of PWAs, building himself some great one like the Webboard.
- Rumsha Siddiqui is a new code developer to the project who will be focusing on platforms.
- Killian McCoy is core developer who will be working on special projects.
- Judah Himango who is also pretty new in our team and will start working with us on the Android package generation.

PWA Builder was built with a simple idea in mind: helping web developers to easily create PWAs from their existing web apps. It is focused on analyzing your site to identify gaps in your PWA. We check to make sure you are secure, we help you create or update your W3C manifest and provide some basic options to bootstrap your first service worker. Lastly, we help you publish your PWA everywhere, including the eligible stores.

We feel as if we’ve completed this goal, as we see thousands of web sites being converted every month. We believe it’s time to set a new goal of making PWAs more app-like. We’ll continue to improve our scanning tools, but we’re adding a bunch of new tools and components to help PWA developers build a “better” PWA.

We’ve then started to think how we can help PWAs developers having packaged features, useful and easy to use. We wanted also to fill the gaps between native experiences and installed PWAs. We then simply started by asking ourselves what we would need as PWA developers and we’ve started with those 3 features:

  • A PWA installer web component. We already blogged about it: Installing Progressive Web Apps. The global idea is to improve the install experience of a PWA. For that, we thought we needed to explain to the end-user the benefits he would get from installing it on his machine, following some paradigms we can find in app stores today. Good news? Most of the information are stored in the W3C manifest! So, the web component is getting the data from there and present it to the user in a nice and engaging way. Check our article and our <pwa-install /> component code. We’d love to hear your feedback, get your issues and/or PR contributions 😊
<pwa-install> web component in action getting the data from the W3C manifest
<pwa-install> web component in action getting the data from the W3C manifest
  • A PWA loader web component we’re currently building. It turns out that a lot of PWAs doesn’t expose a loading screen while everything is being downloaded. Sometimes, it then clearly shows it’s a web page progressively downloading resources like images and so on. You usually don’t get this experience with native apps. The web component is then taking care of displaying an animation while the page is ready to be fully displayed and interactive. Once again, it takes some configuration properties from the PWA manifest if available or can be configured in a custom way. We’ve learned a lot while writing it, we’ll do a separate blog post later.
  • A Push Notification service built by Dale Stammen. This is a feature very useful to engage with the user even when the PWA is closed. You can read more about it in this article: Myth Busting PWAs — The New Edge Edition in the “Myth 7: PWAs can’t run in the background”. The goal of this service, hosted as an Azure Function, is to help you implementing and testing a push notification service from your service worker in a very easy way. No need to setup a back-end server, we will do this for you. The service is great to start experimenting this feature and we will provide you the steps to migrate from our experimental service to a production one.
Push Notification being displayed on a Windows 10 PC

Jeff has showcased some draft of those new 3 features during his Ignite conference. You can watch it: Building PWAs to reach users on Windows and beyond. People feedback in the room tended to confirm we’re going in the right direction. Please also share yours in the comments!

We’re also inside a sprint in December where we’re going to work on the following list:

· Remove the iOS platform until the Apple store strategy allows for us to revisit.
· Merge the dev branch into master. We have indeed a lot of new features currently exposed on our dev preview: https://dev.pwabuilder.com/ that need to land into the main production server.
· Use the Google Llama Pack tooling to try to automate the generation of the TWA from our Cloud server.
· Implement the design for the page exposing the Push Notification services.
· We currently have various warnings during compilation & issues around the sourcemap generation with Vue / Nuxt which prevents us to have the best in class debugging experience. We took an existing source code heritage and not yet experts in this stack.
· Improve the responsive design.
· Finish the PWA-Loader component, publish it & write the documentation
· Finally, we’ve seen this awesome tool pwa-asset-generator built by Önder Ceylan and we’re starting to have conversion with him on possible collaboration / integration of this work.

Want to get involved? As you can see by our new projects, our team is eager to work with the community to deliver what developers really need. A few areas we are looking for collaboration:

- If you have skills in on Nuxt / Webpack, we need your help
- Looking for contributors for our new components like loading screen and install button
- Please share your ideas (and contributions) about what our new web components should be.

Let us know on github and let’s build a better world for PWAs together!

David Rousset
@davrous

--

--