Recently I was fortunate to be able to attend the Google Polymer Summit in Copenhagen with a SitePen colleague. Having attended the PWA Summit last year in Amsterdam we were expecting a well organised and interesting conference, and we were not to be disappointed.
It was great to see so many people from all the world talking not only about Polymer but web components and the web platform in general. All of the talks were interesting over the two day event. Here we’ll focus on a few of the subjects that excited us the most.
Keynote: Wendy Ginsberg & Fred Schott
The keynote focused on Polymer and the evolution of the project leading up to the announcement of Polymer 3.0.0. This included two big changes the team was very excited about:
- Moving to NPM and yarn for package management
- Moving away from HTML Imports to ES Modules
It may seem that the announcement of Polymer using NPM for package management isn’t big news. To the Polymer team and their users, it is a significant step forward into today’s ecosystem. Up until now, all the Polymer packages have only been available from Bower.
Using ES Modules over HTML Imports was more controversial, dividing opinions across the conference attendees and my twitter feed. It will be interesting to see how this move works for Polymer and whether staunch supporters of HTML Imports can be won over!
End To End Apps With Polymer: Kevin Schaaf
Custom elements are excellent for building reusable components on the web. Yet there have long been questions around how to build an App with Polymer and custom elements. Kevin from the core Polymer team was here to tell us how this can be done today. Kevin highlighted some familiar challenges before concentrating on the ones that still prove to be challenging with custom elements and Polymer today. These challenges are ones that all frameworks attempt to solve in various ways:
- Structure for performance
- Factor the UI
- Manage state
- Serve for deployment
For us at Dojo 2, we were interested to hear how the Polymer team solved the challenge of managing application state. This is because it’s an area that we have been concentrating on for Dojo 2 over the last few weeks.
Polymer’s recommendation for state management is to use Redux. Redux is a store that promotes a uni-directional data flow with a single mechanism for creating events that mutate the data through a dispatcher. The global redux store provides a consistent view of a complete application state. This enables powerful development and debugging tools such as the Redux devtools.
With Dojo 2, we have also found that this pattern works well in a reactive architecture. However, with Redux we have found many of the best practices are left to user interpretation. One example of this is the common question “where do I put my business logic, do I put it in an action or a reducer?”. Additionally Redux requires middleware to support many common everyday application paradigms (such as async flow support). Once again, this puts the onus on the consumer to choose a solution from the vast examples available, which can be daunting.
We still think that Redux is a good choice for state management and even have an example Dojo 2 Todo MVC implementation that demonstrates how to use Redux with Dojo 2! However, for Dojo 2 we are looking to provide a more opinionated, fully-featured solution out of the box, aiming to reduce the complexity and ambiguity that is so often encountered when getting started with Redux.
Look out for some Dojo 2 stores news soon!
Custom Elements Everywhere: Rob Dodson
During his talk, Rob Dodson introduced a very cool idea he has been working on called Custom Elements Everywhere. This is a group of scenarios designed to score frameworks for their support of custom elements. The driver for this was to show how interoperability can be achieved through custom elements today!
With Dojo 2, custom elements have always been in the forefront of our minds. With the same goal, an opportunity to enable interoperability for Dojo 2 exists within the wider community and the web platform.
Rob had already implemented the scenarios for a few of the major frameworks such as React, Angular and Vue. But he was looking for help adding more examples from the multitude of current JavaScript frameworks!
We knew that all Dojo 2 widgets could be compiled to a custom element using the Dojo CLI by defining a simple widget wrapper. This gives the interop for Dojo 2 widgets in other environments or frameworks. But Rod’s invitation to help provide more examples gave us an itch to show Dojo 2’s support for consuming custom elements.
So off we went and spent the first hour of the summit after party implementing the scenarios for Dojo 2! We were very excited when we saw Dojo 2 passed every scenario and rushed to raise a pull request.
For a deeper dive on Dojo 2 and custom elements, you can check out:
Conclusion
With increasing custom elements support across the browser vendors, we see custom elements becoming more prominent in the growing ecosystem of framework choices.
All of the talks at the conference were engaging and informative, check out the Polymer Summit website to watch any of the sessions. We are excited to see how custom elements can continue to bring the web together! Thank you to Google for having us.