expose preload/prefetch/scripts rendering on render context if no template is provided

src/server/create-renderer.js

@@ -40,7 +40,7 @@ export function createRenderer ({
   clientManifest
 }: RenderOptions = {}): Renderer {
   const render = createRenderFunction(modules, directives, isUnaryTag, cache)
-  const templateRenderer = template && new TemplateRenderer({
+  const templateRenderer = new TemplateRenderer({
     template,
     shouldPreload,
     serverManifest,
@@ -53,13 +53,16 @@ export function createRenderer ({
       done: (err: ?Error, res: ?string) => any,
       context?: ?Object
     ): void {
+      if (!template && context && clientManifest) {
+        exposeAssetRenderFns(context, templateRenderer)
+      }
       let result = ''
       const write = createWriteFunction(text => {
         result += text
       }, done)
       try {
         render(component, write, () => {
-          if (templateRenderer) {
+          if (template) {
             result = templateRenderer.renderSync(result, context)
           }
           done(null, result)
@@ -76,7 +79,10 @@ export function createRenderer ({
       const renderStream = new RenderStream((write, done) => {
         render(component, write, done)
       })
-      if (!templateRenderer) {
+      if (!template) {
+        if (context && clientManifest) {
+          exposeAssetRenderFns(context, templateRenderer)
+        }
         return renderStream
       } else {
         const templateStream = templateRenderer.createStream(context)
@@ -89,3 +95,11 @@ export function createRenderer ({
     }
   }
 }
+
+// Expose preload/prefetch and script render fns when client manifest is
+// available.
+function exposeAssetRenderFns (context: Object, renderer: TemplateRenderer) {
+  context.renderPreloadLinks = renderer.renderPreloadLinks.bind(renderer, context)
+  context.renderPrefetchLinks = renderer.renderPrefetchLinks.bind(renderer, context)
+  context.renderScripts = renderer.renderScripts.bind(renderer, context)
+}

src/server/template-renderer/index.js

@@ -13,7 +13,7 @@ const JS_RE = /\.js($|\?)/
 export const isJS = (file: string): boolean => JS_RE.test(file)
 
 type TemplateRendererOptions = {
-  template: string;
+  template: ?string;
   serverManifest?: ServerManifest;
   clientManifest?: ClientManifest;
   shouldPreload?: (file: string, type: string) => boolean;
@@ -40,7 +40,7 @@ export type ClientManifest = {
 
 export default class TemplateRenderer {
   options: TemplateRendererOptions;
-  template: ParsedTemplate;
+  parsedTemplate: ParsedTemplate | null;
   publicPath: string;
   serverManifest: ServerManifest;
   clientManifest: ClientManifest;
@@ -50,7 +50,11 @@ export default class TemplateRenderer {
 
   constructor (options: TemplateRendererOptions) {
     this.options = options
-    this.template = parseTemplate(options.template)
+    // if no template option is provided, the renderer is created
+    // as a utility object for rendering assets like preload links and scripts.
+    this.parsedTemplate = options.template
+      ? parseTemplate(options.template)
+      : null
 
     // extra functionality with client manifest
     if (options.serverManifest && options.clientManifest) {
@@ -67,7 +71,10 @@ export default class TemplateRenderer {
 
   // render synchronously given rendered app content and render context
   renderSync (content: string, context: ?Object) {
-    const template = this.template
+    const template = this.parsedTemplate
+    if (!template) {
+      throw new Error('renderSync cannot be called without a template.')
+    }
     context = context || {}
     return (
       template.head +
@@ -178,7 +185,10 @@ export default class TemplateRenderer {
 
   // create a transform stream
   createStream (context: ?Object): TemplateStream {
-    return new TemplateStream(this, context || {})
+    if (!this.parsedTemplate) {
+      throw new Error('createStream cannot be called without a template.')
+    }
+    return new TemplateStream(this, this.parsedTemplate, context || {})
   }
 }
 

src/server/template-renderer/template-stream.js

@@ -10,11 +10,15 @@ export default class TemplateStream extends Transform {
   template: ParsedTemplate;
   context: Object;
 
-  constructor (renderer: TemplateRenderer, context: Object) {
+  constructor (
+    renderer: TemplateRenderer,
+    template: ParsedTemplate,
+    context: Object
+  ) {
     super()
     this.started = false
     this.renderer = renderer
-    this.template = renderer.template
+    this.template = template
     this.context = context || {}
   }
 

test/ssr/ssr-template.spec.js

@@ -25,14 +25,17 @@ function generateClientManifest (file, cb) {
   })
 }
 
-function createRendererWithManifest (file, cb, shouldPreload) {
+function createRendererWithManifest (file, options, cb) {
+  if (typeof options === 'function') {
+    cb = options
+    options = null
+  }
   generateClientManifest(file, clientManifest => {
-    createBundleRenderer(file, {
+    createBundleRenderer(file, Object.assign({
       asBundle: true,
       template: defaultTemplate,
-      clientManifest,
-      shouldPreload
-    }, cb)
+      clientManifest
+    }, options), cb)
   })
 }
 
@@ -176,8 +179,14 @@ describe('SSR: template option', () => {
     })
   })
 
-  it('bundleRenderer + renderToStream + clientManifest', done => {
-    createRendererWithManifest('split.js', renderer => {
+  it('bundleRenderer + renderToStream + clientManifest + shouldPreload', done => {
+    createRendererWithManifest('split.js', {
+      shouldPreload: (file, type) => {
+        if (type === 'image' || type === 'script' || type === 'font') {
+          return true
+        }
+      }
+    }, renderer => {
       const stream = renderer.renderToStream({})
       let res = ''
       stream.on('data', chunk => {
@@ -187,10 +196,29 @@ describe('SSR: template option', () => {
         expect(res).toContain(expectedHTMLWithManifest(true))
         done()
       })
-    }, (file, type) => {
-      if (type === 'image' || type === 'script' || type === 'font') {
-        return true
-      }
+    })
+  })
+
+  it('bundleRenderer + renderToString + clientManifest + no template', done => {
+    createRendererWithManifest('split.js', {
+      template: null
+    }, renderer => {
+      const context = {}
+      renderer.renderToString(context, (err, res) => {
+        expect(err).toBeNull()
+
+        const customOutput =
+          `<html><head>${
+            context.renderPreloadLinks() +
+            context.renderPrefetchLinks()
+          }</head><body>${
+            res +
+            context.renderScripts()
+          }</body></html>`
+
+        expect(customOutput).toContain(expectedHTMLWithManifest(false))
+        done()
+      })
     })
   })
 })