Client Hints

Gumlet has support for Client Hints out of the box. If you configure your webpage to pass client hints for images, Gumlet server will automatically send resized images. Here are the client hint headers that we support.

Sec-Ch-Viewport-Width

Sec-Ch-DPR

Sec-Ch-Width

The HTML page must also have Client-Hints enabled, which can be accomplished using either HTML or HTTP. To enable Client-Hints via HTML, add the following line in the <head> of your page, before any <link>, <style>, or <script> elements:

<meta http-equiv="delegate-ch" content="sec-ch-width https://yourdomain.gumlet.io; sec-ch-dpr https://yourdomain.gumlet.io; sec-ch-viewport-width https://yourdomain.gumlet.io;">

Alternatively, to enable Client-Hints via HTTP, add the following headers to your HTML document's response:

Permissions-Policy: ch-dpr=("yourdomain.gumlet.io"), ch-width=("yourdomain.gumlet.io"), ch-viewport-width=("yourdomain.gumlet.io"")
Accept-CH: Sec-CH-DPR, Sec-CH-Width, Sec-CH-Viewport-Width

📘

Things to note!

  • Please, replace https://yourdomain.gumlet.io in the snippets above with the origin of your image URLs.

  • Browsers will only attach client hints to requests for URLs that use the HTTPS protocol.

  • In order to send the Sec-CH-Width hint, which is required for Gumlet's automatic image width feature, the <img> element must have a sizes attribute.

  • Client hints are only supported in Chromium-based browsers.