Static GitHub Issues

[12] Eliminate external resource requests (above and below the fold)

prev: Allow usage of CSS preprecessors
next: Allow custom port # through npm config

What would you think of a nuxt.js app using making no external resource requests for it's own JS and CSS files? It would all be inline injected into lib/views/app.html

Before:

<% const {
  title, htmlAttrs, bodyAttrs, link, style, script, noscript, meta
} = context.meta.inject() %><!DOCTYPE html>
<html n-head-ssr ${htmlAttrs.text()}>
  <head>
    ${meta.text()}
    ${title.text()}
    ${link.text()}
    ${style.text()}
    ${script.text()}
    ${noscript.text()}
    <base href="<%= baseUrl %>">
    <% if (!dev) { %><link rel="stylesheet" href="<%= files.css %>"><% } %>
  </head>
  <body ${bodyAttrs.text()}>
    <%= APP %>
    <script type="text/javascript" defer>window.__NUXT__=<%= serialize(context.nuxt) %></script>
    <script src="<%= files.vendor %>" defer></script>
    <script src="<%= files.app %>" defer></script>
  </body>
</html>

After:

<% const {
  title, htmlAttrs, bodyAttrs, link, style, script, noscript, meta
} = context.meta.inject() %><!DOCTYPE html>
<html n-head-ssr ${htmlAttrs.text()}>
  <head>
    ${meta.text()}
    ${title.text()}
    ${link.text()}
    ${style.text()}
    ${script.text()}
    ${noscript.text()}
    <base href="<%= baseUrl %>">
    <% if (!dev) { %><style><%= files.css.CODE %></style><% } %>
  </head>
  <body ${bodyAttrs.text()}>
    <%= APP %>
    <script type="text/javascript" defer>window.__NUXT__=<%= serialize(context.nuxt) %></script>
    <script><%= files.vendor.CODE %></script>
    <script><%= files.app.CODE %></script>
  </body>
</html>
<!--cmty--><!--cmty_prevent_hook--><div align="right"><sub><em>This feature request is available on <a href="https://nuxtjs.cmty.io">Nuxt.js</a> community (<a href="https://nuxtjs.cmty.io/nuxt/nuxt.js/issues/c9">#c9</a>)</em></sub></div>