PWA Series: 🍸 Discovery and Interview of Nick from makemeacocktail.com
Kevin Picchi
Software Engineer and Developer Advocate
We at Samsung Internet care a lot about Progressive Web Apps (PWAs), this is why we decided to feature some awesome PWAs that we found online.
Firstly, what are PWAs?
Progressive Web App (PWA) is a concept created by Frances Berriman and Alex Russel to describe apps taking advantage of new features supported by modern browsers that are built using including HTML, CSS, and JavaScript (yes, just web technologies ❤).
This is the introduction to Laura’s blog post.
I recommend reading her blog post if you are interrested in making a PWA: Progressive Web Apps: Making app-like experiences in the browser
Context
I discovered Make me cocktail, thanks to Dan (The Director of Web Advocacy at Samsung Internet) during a conversation about PWAs that he was using.
I found the Web app particularly useful, especially the “my bar” feature which is just doing the job and making it easier to find nice recipes using only what we have at home. Also, very convenient for noobs like me.
We thought why not reach out, learn more about why they choose to develop a PWA for their platform and write a blog post about it!
An Interview with Nick Wilkins from Make Me A Cocktail
Make me a Cocktail was founded in 2010, by Nick, with the goal of becoming the best online platform related to cocktail and drink recipes. All of this started because Nick became annoyed of browsing the web trying to find a decent cocktail recipes, and so he decided to create his own platform!
Since then the platform evolved and became more popular with more functionalities and design improvements.
Why did you decide to make the website a PWA?
We originally floated the idea of making the site a PWA when we were investing in a small rewrite of some core underlying structures on the site, and seeing what new technologies had emerged and were emerging in the dev world.
At this time we were also investing heavily in performance and trying to understand how we could make our fairly image- and dynamic- rich site, fast and performant for all our users. We were also really keen to explore the possibilities or porting our site over to an app — and this seemed like a great emerging option for this.
Did you encounter any technical challenges during the process?
We decided early on to not make our site a pure fully-works-offline PWA, but to utilise all of the technologies and opportunities a PWA gives you to give the best experience to the user.
Obviously the service worker was a large part of this, and that was the core technical challenge we encountered. Good documentation and tutorials were sparse when we first started to utilise it. Browser dev tools weren’t quite as slick for service workers as they are now, so the core hurdles were dealing with understanding the service worker lifecycle and how to test new ones efficiently and cleanly.
Our knowledge of dev tools and the network pane specifically, really increased here.
How did the PWA help you, and how did you utilise the service worker power?
Ultimately the PWA has helped us in two areas.
One is speed and performance. The service worker caching mechanisms and thus serving up assets quickly to users is just a win-win situation.
But, we also like to think, and this is a little less tangible, that we’ve given users more accessibility and a better user-experience / option to find data quicker. Things like the manifest, the add to home screen options and the like have helped create quicker avenues to data for the end-user.
Thoughts
It really is fairly easy now to create a base PWA without offline capability. Depending on your app size and complexity, and your stack, adding full or partial offline capability can be harder and more of a technical challenge. Dynamic user based data that you can’t cache upfront (or can’t cache up to date data) comes at a price if you want to go down that route, and it's important to explore all those avenues.
There are little cons to implementing the base PWA experience, the cons really come with time and knowledge that you may need to invest. But ultimately it is all worth it.
Conclusion
As said by Nick above, creating PWAs is the way to give better experiences to users.
This is why at Samsung Internet, we do care a lot about PWAs, and we are currently seeking for PWAs with good user experience to share with the community or even write about!
Please contact us by email browser@samsung.com or Twitter if you are working on a PWA or know a good PWA !
Thank you,
Kevin (@KevinPicchi, picchi.ch)
