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

Option to put <link/> elements at bottom of page #7

Open
jglesner opened this issue Mar 22, 2020 · 3 comments
Open

Option to put <link/> elements at bottom of page #7

jglesner opened this issue Mar 22, 2020 · 3 comments

Comments

@jglesner
Copy link

jglesner commented Mar 22, 2020 •
edited
Loading

Issue Type: Feature Request

Description: Given the support for prefetch, it seems like it would be worthwhile to add support for media tags, and putting prefetch links down at the bottom of the index file, rather than in the head. I'm not an expert on render blocking, but it seems like putting non-critical elements outside of head (which seems to render block). Thoughts?
@slaweet
Copy link

slaweet commented Feb 17, 2021 •
edited
Loading

I would even think that appending at bottom of the <body> should happen by default for rel: 'prefetch'. But just having the option to control it would be fine as well.

Any update from maintainers of this package?

@slaweet
Copy link

slaweet commented Feb 17, 2021 •
edited
Loading

After a bit of exploration, I found https://github.com/architgarg/html-webpack-injector:

Plugin that simplifies injection of chunks into head and body using HtmlWebpackPlugin

I forked it and added one commit to "Move <link rel="prefetch" ...> from <head> to <body>" slaweet/html-webpack-injector@155b57d. So it is possible to control which links are in <head> and which in <body> without modifying this vuejs/preload-webpack-plugin project.

Unfortunately, even when all <link rel="prefetch" ...> elements are at the bottom of the page, they are still blocking the DOMContentLoaded event and a Vue SPA won't start until they are all loaded. so I didn't see any performance improvement from doing all of this (tested on build served with https://www.npmjs.com/package/serve in Google Chome 88).

@rodrigocfd
Copy link

Is this feature request the same descibed here?

If so, it would be really interesting. Right now I'm in trouble because I need to build a template without a <head>, but it keeps being created to inject the tags.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
3 participants
@slaweet @rodrigocfd @jglesner