Provide a tool that will transpile 3rd party packages so that they can be used with <script type="module">.
Motivation
The primary reason is to provide a way for developers to take advantage of <script type="module"> while still remaining within the Steal ecosystem and taking advantage of Steal's tooling (especially steal-tools and its multi-build).
Speed
Loading a Steal application in development can be slow. This is for a number of reasons:
Hundreds of files can be loaded if using a few libraries.
Steal doesn't start loading your main module until it's loaded configuration. This causes a waterfall for loading.
Some of the code is complex (and possibly inefficient) such as the node_modules algorithm.
All files with import/export are transpiled to ES5, even for features the browser supports (such as class).
All loading happens in the main thread. Expensive operations like transpiling block other modules from loading.
Some of this problems can be remedied easily, some would require a significant amount of work, but probably it would never be possible to match the browser's loading speed.
Compatibility
Since the native <script type="module"> cannot be extended (except through ServiceWorker fetch hook), Steal is essentially incompatible with the use of <script type="module">. This forces developers to choose either Steal (ands its features) or choose the native loader.
Impact
This will be an alternative to using steal.js in development. steal-tools should still work for production builds.
Design
Note: I'm calling this tool steal-tools web-bundle below but that is just a code name, open to changing it.
I'm proposing a new tool in the Steal ecosystem that makes a project web-compatible (compatible with <script type="module">).
This tool can be used a couple of different ways:
steal-tools web-bundle can-stache
This will look for the can-stache package and:
Transpile it to ES module syntax.
Bundle all of the package's files into a single module.
Export this module somewhere, like vendor/can-stache.js.
You can also bundle all of your project's dependencies by running:
steal-tools web-bundle
This will load your package.json main and compile any child packages.
Plugins
Since <script type="module"> does not have any hooks, it's not possible to load non-JavaScript modules with it. There are a couple of possible workarounds:
Transpile plugins to JavaScript using a Node.js tool (maybe steal-tools web-bundle).
Use Service Workers to provide the ability to create plugins on-the-fly.
These options have strengths and weaknesses. For this reason I would consider plugins to be out-of-scope for the first version of this project, and something we add afterwards.
Summary
Provide a tool that will transpile 3rd party packages so that they can be used with
<script type="module">
.Motivation
The primary reason is to provide a way for developers to take advantage of
<script type="module">
while still remaining within the Steal ecosystem and taking advantage of Steal's tooling (especially steal-tools and its multi-build).Speed
Loading a Steal application in development can be slow. This is for a number of reasons:
class
).Some of this problems can be remedied easily, some would require a significant amount of work, but probably it would never be possible to match the browser's loading speed.
Compatibility
Since the native
<script type="module">
cannot be extended (except through ServiceWorkerfetch
hook), Steal is essentially incompatible with the use of<script type="module">
. This forces developers to choose either Steal (ands its features) or choose the native loader.Impact
This will be an alternative to using steal.js in development. steal-tools should still work for production builds.
Design
I'm proposing a new tool in the Steal ecosystem that makes a project web-compatible (compatible with
<script type="module">
).This tool can be used a couple of different ways:
This will look for the
can-stache
package and:vendor/can-stache.js
.You can also bundle all of your project's dependencies by running:
This will load your package.json main and compile any child packages.
Plugins
Since
<script type="module">
does not have any hooks, it's not possible to load non-JavaScript modules with it. There are a couple of possible workarounds:steal-tools web-bundle
).These options have strengths and weaknesses. For this reason I would consider plugins to be out-of-scope for the first version of this project, and something we add afterwards.