Skip to content

Latest commit

 

History

History
40 lines (33 loc) · 1.04 KB

README.md

File metadata and controls

40 lines (33 loc) · 1.04 KB

grow-ext-preload-assets

Extension for the static-site generator Grow that enables asset preloading from within partials

Concept

This extension comes in handy if you want add preload tags for critical assets. See https://web.dev/preload-responsive-images/

Usage

Initial setup

  1. Create an extensions.txt file within your pod.
  2. Add to the file: git+git://github.com/jungvonmatt/grow-ext-preload-assets
  3. Run grow install.
  4. Add the following section to podspec.yaml:
ext:
- extensions.inline_text_assets.PreloadAssetsExtension

This configuration a bundle to your documents that can be used in your templates with for example

{%- do doc.preload.addAsset({
  'src': 'wolf.jpg',
  'srcset': 'wolf_400px.jpg 400w, wolf_800px.jpg 800w, wolf_1600px.jpg 1600w'
  'sizes': '50vw'
}) -%}
{% endif %}
<head>
  {{ doc.preload.emit() }}
  ...
<head>
  <link rel="preload" as="image" href="wolf.jpg" imagesrcset="wolf_400px.jpg 400w, wolf_800px.jpg 800w, wolf_1600px.jpg 1600w" imagesizes="50vw">