manifest.json vs manifest.webmanifest

Question

I'm developing an application using mongodb, Node.JS and PWA. In the first step of developing I don't know what is the difference between manifest.json and manifest.webmanifest.

Volsci

Answer 1

November 2019 Update

The difference is mentioned in MDN (Mozilla Developer Network):

The .webmanifest extension is specified in the Media type registration section of the specification (the response of the manifest file should return Content-Type: application/manifest+json). Browsers generally support manifests with other appropriate extensions like .json (Content-Type: application/json).

You can read more details on: Media Type Registration

Volsci

Answer 2

There are no big difference rather than naming. Use whichever you prefer: href="/manifest.webmanifest" or "/manifest.json". Just don't forget that MIME type has to be: application/manifest+json in both cases.

<link rel="manifest" href="/manifest.webmanifest">
<link rel="manifest" href="/manifest.json">

Note that spec says it should be manifest.webmanifest. And later it may be important because it is under heavy development.

For more info check: W3C and MDN

Midyear

I have seen the link you sent before I ask the question. The problem is that I can't understand the difference of them. – Volsci

As I have understood it is under development and they considering is it worth to add some specific extension or not. So e.g why we have .css and .html files when it is usual text file why not .txt? Because it is more clear and reliable. I believe here is the same deal. .webmanifest only for clarification where it should be used, while syntacis will be 100% same as .json. But Is it realy worth to add specific extention? It is still not cleare because it may confuse some developers as we can clearly see now :) – Midyear

hmm, I think they have some differences as you said it is confusing, but I don't know them. – Volsci

I realy doubt they have. I beleive you can provide whatever name and whatever extention just it should match with <link rel="manifest" href="manifest.webmanifest"> in header and should be in JSON format. So it can be <link rel="manifest" href="myfile.mucustomextention"> – Midyear

Answer 3

Like mentioned in the other answers, there's not much of a difference in both.
But, according to webhint.io, it is recommended to use manifest.webmanifest.

manifest-file-extension warns against using non-standard file extensions for the web app manifest file.

While the .webmanifest file extension is not enforced by the specification, nor is it required by browsers, using it makes it:

• easier to set custom server configurations for the web app manifest file
• possible to benefit from existing configurations

This is also displayed as a tip in Microsoft Edge Browser Dev-tools in the issue panel (screenshot below)

Fanaticism

Answer 4

As said in other answers, a .webmanifest file is recognized as a simple JSON file by the editors.

But using the .webmanifest extension allows you to setup a specific process in your development tools (linting, deployment).

For example, you can configure VSCode editor to check your .webmanifest file against the Web App Manifest JSON schema and provide autocompletion.

Gangway