Posts

Using WebSocket, Service Worker, Push and Background Sync Advanced Web APIs in a Plain JavaScript Tutorial Echo Chat Client App

Recently, through a tutorial echo chat client app I developed, I was pleasantly surprised to experience the features of advanced web API of WebSockets, Service Workers & IndexedDB, Background Sync API and Web Push API available in Chromium based browsers like Chrome and Edge. Note that these features are provided directly by the browser and accessible via plain HTML and JavaScript. We do not need external libraries and frameworks to access them. The advanced web API features mentioned above, with the exception of WebSockets, are considered to be part of Progressive Web Apps (PWAs). I need to mention here that I got back to industry-level software development in 2024 after a gap of over 20 years and my first very limited exposure to developing a minimal PWA app with PWA functionality provided by default by Create React App tool, was in March 2024. Details So when I developed this tutorial echo chat client app, I was quite astonished to see how many device platform capabilities we...
Post a Comment
Read more

HTML Refresher and Detailed Study - Part 17

Last updated on 6 July 2026 Post series: Part 1 ,     Prev Part (16) ,     Post Series TOC Contents (sections and/or jump links) Stage-8: Review rounds followed by snapshot folder creation Review rounds for client and server At Browser API level, Service Workers see unique ids for every tab/PWA but main script does not; Ping-Pong approach to identify active tab Broadcast Channel API does not provide list of clients subscribed to it Show push notification if multiple (chat) tabs are open clients.matchAll() list of clients is in order of most recently focused as per MDN git command to show when a particular line of code was added Multi-App workspace with Live Server resulted in URL check for 'client' which would fail in Netlify app When using Live Server for PWA apps in monorepo, change server root to client folder instead of monorepo root Discussion on ways for Service Worker to identify active tab and duplicate connection tab ...
Post a Comment
Read more