2,993 reads

Must use tools to build better Progressive Web Apps

by sureshdskJanuary 12th, 2018

Too Long; Didn't Read

Recent browser enhancements like service workers, caching brought a new dimension to building apps with html and javascript called Progressive web apps. While they are getting popular, we must know the tools available for build better progressive web applications that are easy for developer as well as the end user. We can categorize these tools as below,

Companies Mentioned

featured image - Must use tools to build better Progressive Web Apps

Development Tools
Framework specific Tools
Debug Tools
Performance Tools

Development Tools

Workbox

Workbox is a collection of libraries and build tools that make it easy to build offline first web apps.

https://developers.google.com/web/tools/workbox/

Offline plugin for webpack

This plugin is intended to provide an offline experience for webpack projects.

https://github.com/NekR/offline-plugin

Demo: https://offline-plugin.now.sh/

Pinterest service workers

A collection of utilities for creating/testing/experimenting with service workers.

https://github.com/pinterest/service-workers

PWA Builder

https://www.pwabuilder.com/generator PWA.tools takes data from your site and uses that to generate cross-platform Progressive Web Apps

Framework specific tools

Framework specific tools helps to app creation index.html app shell generate, manifest and sw generation.

Debug Tools

Chrome Dev Tools

Use the Application panel to inspect, modify, and debug web app manifests, service workers, service worker caches.

Links:

Performance Tools

Light house

Lighthouse is an open-source, automated tool for improving the quality of web pages. You can run it against any web page, public or requiring authentication. It has audits for performance, accessibility, progressive web apps, and more.

You can run Lighthouse in Chrome DevTools, from the command line, or as a Node module.

https://developers.google.com/web/tools/lighthouse/