Skip to content

Instantly share code, notes, and snippets.

@marcoscaceres

marcoscaceres/manifest-options.md

Last active December 13, 2022 02:00
Show Gist options
  • Star 9 You must be signed in to star a gist
  • Fork 2 You must be signed in to fork a gist
  • Save marcoscaceres/7783977 to your computer and use it in GitHub Desktop.
Save marcoscaceres/7783977 to your computer and use it in GitHub Desktop.
Download ZIP
In-lining manifests.
Raw
manifest-options.md

Conclusions

updated on 19th of December

Thanks everyone who participated in the discussion! It was tremendously userful

So, what we are going to do initially is only support:

<link rel="manifest" href="...some URL...">

By virtue of this being a URL, if people really want to inline the manifest they can use a data: URL:

<link rel=manifest href="data:application/manifest+json,{ ... }">

Credit to @yoavweiss for proposing the above on the public-webapps mailing list.

If, after some time, we find a lot of people are inlining manifests in the wild, we can return and look at alternatives - like using <script> or <meta>.

Which one do you prefer?

We are trying to create a new manifest format for the Web. It will allow you to define metadata for a web application in one place.

Right now, we are trying to decide how to "inline" the manifest into HTML. Need your feedback.

A - using a meta element and content attribute

<!doctype html>
<html>
<head>
...
<meta name="manifest" content='{
  "name": "Example",
  "url": "/start.html",
  "mode": "standalone",
  "icons": [{
      "src": "icon/lowres",
      "density": "1",
      "width": "64",
      "type": "image/webp"
    }, {
      "src": "icon/hd",
      "density": "2",
      "width": "64"
  }]
}'>
...

B - using a script tag

<!doctype html>
<html>
<head>
...
<script type="application/manifest+json">
{
  "name": "Example",
  "url": "/start.html",
  "mode": "standalone",
  "icons": [{
      "src": "icon/lowres",
      "density": "1",
      "width": "64",
      "type": "image/webp"
    }, {
      "src": "icon/hd",
      "density": "2",
      "width": "64"
  }]
}
</script>

External linking

<link rel="manifest" href="app.json">`

OR

  <script src="app.json" type="application/manifest+json"></script>

Got a better idea?

Please share it in the comments!

@kevburnsjr
Copy link

Require <link> and allow developers to reference inline manifests using fragment identifiers.

<link rel="manifest" href="#inline-manifest">
<script id="inline-manifest" type="application/manifest+json">
{
  "name": "Example",
  "url": "/start.html",
  "mode": "standalone",
  "icons": [{
      "src": "icon/lowres",
      "density": "1",
      "width": "64",
      "type": "image/webp"
    }, {
      "src": "icon/hd",
      "density": "2",
      "width": "64"
  }]
}
</script>

@CodyErekson
Copy link

I like option B, using <script> tags. Mainly for portability reasons. Being able to easily pull this data into other code with little effort will probably be of enormous value.

@DavidCarcamo
Copy link

external link to a JSON file, please no inline script tag, or JSON in meta tag.

@triblondon
Copy link

I agree with @tobie. We should have options for both external linking and inline embedding of the manifest data, and the only existing tag which gives us that ability in a <head> context is <script>. But, I would be concerned about shifting data for which there are already defined meta tags (as @pornel points out) into the manifest, as developers will then inevitably have to use both.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment