dougludlow
Increases development download times significantly
I've followed the steps described in this comment, and while it indeed works, it makes the browser download a whole bunch of files.
Chrome devtools shows that the simple blue-background page needs 305 requests which takes almost 5 seconds to load.
Is there anything I could do to speed this up?
This plugin is abandoned. Unfortunately we switched the technology and don't have the time and bugdet to maintain this plugin anymore.
I updated the README. However everyone can maintain this plugin furthermore (we would transfer the whole project to the user)
@sashee as I understand it, the main reason for this plugin's slowness is sass.js which is an emscriptemed version of the libSass c library and the reason we can run this in the browser. From the sass.js docs they admit that it's slow:
This is a convenience API for emscripted libsass (at v3.4.3). If you're looking to run Sass in node, you're probably looking for node-sass. Sass.js and node-sass should generate the same results.
A fair warning: minified the worker weighs 3.2MB, gzipped it's still 670KB. If you're on NodeJS, please use the (considerably faster) node-sass instead.
You may also be interested in giving Dart Sass a shot.
Ha ha, sorry, I'm typing on my phone and accidentally closed the issue... 😛
We might take a look at Dart Sass or see if there are any other native js options. That would be our best bet in speeding up the process. We could also take a look at our existing dependencies and make sure we're not using any unnecessary ones with too many dependencies of their own.
@ArmorDarks no, I haven't done anything yet. I took a look at Dart Sass and it looks like it has some potential, however, it's fairly new and hasn't implemented everything yet.
But unfortunately it will be slower than libsass (and thus, node-sass). I must say that on very large projects even libsass isn't that fast.
Maybe Sass can be precompiled somehow, for those who does not plan to run it live in browsers, but need only assembled bundle?
To tell you the truth, that's what I do as the current implementation of plugin-sass is painfully slow. I "simply" hook up gulp with node-sass and gulp watch and hot reload the comiled CSS file.
That's why I've been exploring alternatives to sass.js, but maybe there's a more creative approach that can be taken instead?
To be honest, I even do not know. Recently I gets strong feeling that whole idea about SystemJS and loading all dependencies and transpiling them directly in browsers is quite dead, and HTTP2 inability to improve this only nails stronger the coffin.
JSPM bundling with watch, on contrary, works mostly acceptable, but still isn't as ideal as full hot-reloading...
To tell you the truth, that's what I do as the current implementation of plugin-sass is painfully slow. I "simply" hook up gulp with node-sass and gulp watch and hot reload the comiled CSS file.
Well yeah, that's exactly what we are doing too... But it won't work if you want to use Sass in SystemJS\JSPM with CSS modules.