Reacticon 2018: Progressive Web Apps and Magento 2
In mid-2017, Magento announced that it was developing a new set of tools for building Magento online stores as Progressive Web Apps (PWAs), known as Magento PWA Studio. The techniques that turn a website into a PWA make it possible to switch between pages faster, make pages available offline, and tap into device hardware, such as a smartphone’s notifications or camera. All of this is built on the latest technologies, including React, Redux, Webpack, and GraphQL.
To introduce Magento developers to PWAs and show how they work with Magento, Yireo organized a conference with the fitting name “Reacticon.” With speakers from Magento, Deity, JH, and Snowdog and an audience from all over the world, it was a friendly, diverse event packed with knowledge.
Magento Research
James Zelten (Front-End Architect @ Magento) kicked off the conference with a talk on “fault tolerant software” and on how Magento approaches its work on PWA Studio. The team behind PWA Studio, Magento Research, is self-managing within Magento and has its own GitHub page for the new features it’s building. Working independently of Magento gives the team more freedom and lets them truly innovate.
James explained that PWA Studio development won’t follow the same schedule as Magento’s own releases. There will be alpha and beta releases, but version 1.0 won’t necessarily be the one where everything is finished. Instead, 1.0 will be the version in which the core structure of the software is largely settled.
James Zelten (Front-End Architect at Magento) on “fault tolerant software”
Progressive Web Apps in Magento 2 today
The second talk came from Jisse Reitsma (Yireo), who covered the different caching strategies you can apply with Service Workers. Jisse walked through the pros and cons of each one, but in the end, you’ll still pick a strategy your tools support.
Next up was Shane Osbourne (JH), who talked about adding PWA techniques to existing Magento 2 online stores. There are plenty of ways to make Magento 2 even faster. One example is bundling JavaScript more intelligently than Magento 2 does by default. You can also already add elements to an offline page, so users still see a polished page when they briefly lose their internet connection.
The techniques and tools Jisse and Shane described will also find their way into PWA Studio, but it’s interesting to see that some of them can already be used in current Magento 2 online stores.
The future of Progressive Web Apps and Magento 2
After lunch, Jamie Marie Schouren and Michal Wujas (Deity) demoed online stores already built with React and explored the possibilities of GraphQL with Magento. Starting with Magento 2.3, GraphQL will be supported out of the box, making it easier and faster to retrieve data from Magento. As a result, the front end of the website can run headless and operate independently of the back end, which improves performance.
The final talk, by Andrew Levine (Magento), went deeper into the architecture of PWA Studio. There was no code or demo of PWA Studio yet, but he shared more about how its components can be reused. Interestingly, PWA Studio isn’t a theme you install. It’s a set of tools for building a theme. It will include a range of reusable components that together make up an online store, without the strongly opinionated approach of a theme.
Magento 2.3, with GraphQL support, is due out in Q3 2018. The PWA Studio tools will likely follow soon after, and that’s when we can really get started with Progressive Web Apps and Magento 2. PWA Studio doesn’t have a fixed release date yet.
Andrew Levine on the architecture of PWA Studio
Reacticon 2
Following the success of Reacticon, Jisse Reitsma has announced a second edition. Hopefully, PWA Studio will be released by then.
