What is a Javascript manifest file

DanielAugust 17, 2021August 18, 2021

Lately, I've been hearing quite a lot of talks at my workplace about the Javascript manifests and started to read more about them.

So it turns out that a Javascript manifest is a json file that defines how a Progressive Web App will behave when is installed on a desktop or mobile device. We can see a PWA - Progressive Web App as a hybrid between a webapp and an installed native application. They have access to things like offline storage, location, usb or bluetooth, and so on.

A Javascript manifest file is named manifest.json or .webmanifest and needs to be placed at the root of the website. It has a json format and looks like this:

{ 
    "short_name": "Arrivals", 
    "name": "Arrivals at Sky High", 
    "icons": [ { 
        "src": "launcher-icon.png", 
        "sizes": "48x48", "type": "image/png" }],
    "start_url": "./?utm_source=web_app_manifest", 
    "display": "standalone", 
    "orientation": "portrait", 
    "theme_color": "#29BDBB"
}

Some the things we can define in a manifest file:

• start_url is required and tells the browser where your application should start when it is launched
• display the browser UI showed when your app is launched (eq: you can hide the address bar)
• shortcuts for your app etc

You can read more about it in this article from web.dev - Add a web app manifest.