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.

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

Provide a way for done-ssr to use slim bundles #254

Open
matthewp opened this issue Jun 1, 2017 · 4 comments
Open

Provide a way for done-ssr to use slim bundles #254

matthewp opened this issue Jun 1, 2017 · 4 comments

Comments

@matthewp
Copy link
Contributor

matthewp commented Jun 1, 2017

done-ssr should be able to consume slim bundles just as it can regular steal bundles. This should hopefully be transparent to the user.

@matthewp
Copy link
Contributor Author

Doing a little research on this and want to lay out how this should work.

User experience

The user will have to create a slim build with web and node targets:

stealTools.optimize({}, { 
  target: ["node", "web"]
});

Which will write out something like dist/bundles/{web,node}/my-app/index.js

On the done-ssr side ideally there would not be any extra configuration needed to say that it is a slim build. Hopefully we could open up this file and see that it is a slim format (or conversely, steal format).

Determining main bundle path

When done-ssr is run it will be passed a steal config object like:

{ main: 'donejs-chat/index.stache!done-autorender', ... }

Based on the NODE_ENV we determine that we should load the production bundles.

Internally steal.js is what determines that donejs-chat/index.stache!done-autorender translates to dist/bundles/donejs-chat/index.js. This logic is here.

Ideally this logic could be extracted from steal.js and put into a commonjs module so that other tools (like done-ssr) could use it. Maybe something like steal-normalize-main-bundle:

normalizeMain(mainModuleName, [ bundlesPath ])_

var normalizeMain = require("steal-normalize-main-bundle");

normalizeMain("donejs-chat/index.stache!done-autorender");
// "dist/bundles/donejs-chat/index"

Determining if a slim bundle

Once we know the path to the main bundle we can do an fs.open() to open it and see if it is a slim bundle. Note that we need to insert the node/ into the path so that it is dist/bundles/node/donejs-chat/index.js.

Plugins

The logic for done-ssr's steal integration is contained within the steal zone plugin: https://github.com/donejs/done-ssr/blob/master/zones/steal/index.js

This plugin is a collection of other plugins. The following plugins are specific to steal.js and aren't relevant to the slim build:

  • zones/steal/cache-normalize: Overrides the normalize hook to speed up normalization, doesn't exist for slim builds.
  • zones/steal/reexecute-main: Re-executes the main when the main doesn't export a function. Might need something similar for slim but is super low priority.

The following plugins will need similar versions for slim:

  • zones/steal/load: This is how steal loads the app in node, and sets itself up to call render() on each request. Something very similar (but much more simple) will be needed for slim. This is the first thing to work on.
  • zones/steal/rendering-base-url: This is what done-css uses to determine how to write out its <link> tags.
  • zones/steal/styles/assets: This is how we know what <link> tags to add when rendering. This code is very specific to steal.js but we will need something here for slim.
  • zones/steal/styles/loaded: This is for incremental rendering. Will eventually want something for this, low priority though.

Tasks

The approach I would take to this project is:

  1. Create the steal-normalize-main-bundle project. It should be pretty easy.
  2. Create a basic steal app (not full donejs) that has no additional pages and no css.
  3. Create a script to render it using the zone plugins (not require("done-ssr")) like these tests: https://github.com/donejs/done-ssr/blob/master/zones/zones-steal-test.js
  4. Get this app to load with a slim build. I think this will mostly consist of creating a zones/steal/load-slim plugin that works similar to zones/steal/load.
  5. Add CSS and get that to work (probably will need zones/steal/styles/assets equivalent and maybe zones/steal/rendering-base-url at this point).
  6. Add a second page to the app conditionally loaded using steal.import.
  7. At this point most of the hard stuff is done (hopefully?). Then try a real donejs app like donejs-chat.

@justinbmeyer
Copy link
Contributor

I know we want the same thing to run in the client and on the server ... but how important is that compared to the difficulty of implementing this? Could we have slim on the client and fat build on the server for a while?

@matthewp
Copy link
Contributor Author

We don't have to prioritize this issue, no.

@justinbmeyer
Copy link
Contributor

I’m not trying to argue one way or another really. Depends on how long you think this would take.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants