Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Add rel="preload" option for JS/CSS #203

Merged
merged 5 commits into from Aug 23, 2021
Merged

Add rel="preload" option for JS/CSS #203

merged 5 commits into from Aug 23, 2021

Conversation

pglotov
Copy link

@pglotov pglotov commented Aug 9, 2019 •
edited

Added an option to specify css file with rel="preload":

{% render_bundle 'commons' 'css' is_preload=True %}

It renders to

<link type="text/css" href="/static/dist/commons-ce3c39c62a45f3d1d496.bundle.css" rel="preload" as="style">

@pglotov pglotov changed the title Add rel="preload" option for css Add rel="preload" option for css Aug 9, 2019
@pglotov pglotov force-pushed the isPreload branch 2 times, most recently from 5d1d3ca to f69a02b Compare August 9, 2019 15:03
@fjsj fjsj self-requested a review May 6, 2021 13:19
@fjsj fjsj self-assigned this May 6, 2021
@EthanZeigler
Copy link

Is this exclusive to css? I have a lot of vue apps that would benefit massively from preloading

@andruten
Copy link

@EthanZeigler I think it works with every kind of bundles.

@fjsj fjsj removed their assignment Jul 15, 2021
@joaopslins
Copy link
Contributor

Thanks for the PR! I've also added support for preloading scripted files.

The way I see it, this is the expected way of using this. Let me know if that makes sense:

django-webpack-loader/tests/app/templates/preload.html

Lines 1 to 16 in 075eba3

{% load render_bundle from webpack_loader %}
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Example</title>
{% render_bundle 'main' 'css' is_preload=True %}
{% render_bundle 'main' 'js' is_preload=True %}
{% render_bundle 'main' 'css' %}
</head>
<body>
{% render_bundle 'main' 'js' %}
</body>
</html>

@rvlb I think this deserves a section in the README. Let me know if you are able to do it, or how I can help with this.

@joaopslins joaopslins requested a review from rvlb August 16, 2021 21:48
@rvlb rvlb assigned joaopslins and unassigned rvlb Aug 19, 2021
@rvlb rvlb mentioned this pull request Aug 19, 2021
Closed
11 tasks
@joaopslins joaopslins changed the title Add rel="preload" option for css Add rel="preload" option for JS/CSS Aug 23, 2021
@joaopslins joaopslins merged commit 5839809 into django-webpack:master Aug 23, 2021
@joaopslins
Copy link
Contributor

FYI this was just included in the 1.3.0 version

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

@rvlb rvlb rvlb approved these changes

@fjsj fjsj Awaiting requested review from fjsj

Assignees

@joaopslins joaopslins

Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

None yet
7 participants
@pglotov @EthanZeigler @andruten @joaopslins @rvlb @fjsj @owais