This page is not created by, affiliated with, or supported by Slack Technologies, Inc.
2018-02-23
Channels
- # aleph (8)
- # aws (2)
- # beginners (36)
- # cider (35)
- # cljs-dev (157)
- # cljsjs (3)
- # cljsrn (5)
- # clojure (97)
- # clojure-dev (5)
- # clojure-gamedev (3)
- # clojure-italy (27)
- # clojure-russia (11)
- # clojure-spec (19)
- # clojure-uk (39)
- # clojured (6)
- # clojurescript (87)
- # clojutre (4)
- # community-development (35)
- # cursive (8)
- # datascript (2)
- # datomic (14)
- # dirac (8)
- # duct (3)
- # figwheel (13)
- # fulcro (22)
- # graphql (20)
- # jobs (1)
- # london-clojurians (1)
- # off-topic (55)
- # onyx (3)
- # parinfer (3)
- # protorepl (39)
- # re-frame (3)
- # reagent (26)
- # ring (7)
- # ring-swagger (2)
- # rum (1)
- # shadow-cljs (107)
- # spacemacs (8)
- # test-check (4)
- # unrepl (3)
is there a way to get stats on what is contributing to the release build sizes? my build is giant and I’m trying to figure out why
My release build size is currently huge, I see quickly scanning over the minified code that for example all material-ui icons are bundled
module$node_modules$material_ui_icons$Gamepad
But it's still acceptable size with gzip
https://clojureverse.org/t/help-wanted-release-bundle-size-visualization/871/9?u=thheller
haha
831.76 KB node_modules/material-ui-icons
203.19 KB node_modules/material-ui
ok I'm defenitely going to just download each svg that I use, damn!they create react svg elements
var _ref = _react2.default.createElement('path', { d: 'M22 5.72l-4.6-3.86-1.29 1.53 4.6 3.86L22 5.72zM7.88 3.39L6.6 1.86 2 5.71l1.29 1.53 4.59-3.85zM12.5 8H11v6l4.75 2.85.75-1.23-4-2.37V8zM12 4c-4.97 0-9 4.03-9 9s4.02 9 9 9c4.97 0 9-4.03 9-9s-4.03-9-9-9zm0 16c-3.87 0-7-3.13-7-7s3.13-7 7-7 7 3.13 7 7-3.13 7-7 7z' });
sometimes wired bugs occur can be fixed by lein clean
when using with lein. maybe it's better to always clean before start?
@doglooksgood lein clean
should not be required at all. if something doesn't work but works after lein clean
I want details.
yup, I do that for example ["material-ui-icons/Hotel" :as Hotel]
this means I have required ["material-ui-icons"]
somewhere?
I just setup a project, but I forgot to npm install react(I use reagent), then I kill the REPL process, add npm dependency with yarn. when start shadow-cljs again, i met OutOfMemory.
shadow-cljs - config: /Users/shitianshu/sideline/loadstone/shadow-cljs.edn version: 2.1.24
shadow-cljs - socket connect failed, server process dead?
also I got this when type shadow-cljs in terminal.
@thheller I think this is not a urgent issue, you can just ignore. when i have time, i can create a repo that reproduce the problem.since i killed that repl in emacs, i don't have the error stack at this moment. no enough information to locate the problem.
hmm if you forcefully kill the shadow-cljs process it won't clean up after itself. thats why you get socket connect failed, server process dead?
wow, the bundle went from 1,8mb down to 306,5kb, I was not paying attention to the bundle size
one issue currently is that npm install
does not trigger a recompile. if you have a watch
running that failed because of a missing npm dependency that build will stay stuck
so i if i do shadow-cljs server
then shadow-cljs release :app
and then navigate to http://localhost:9630/ I get “no release snapshots found”
@lee.justin.m not release. like I said you need to run this from the REPL. shadow-cljs clj-repl
and then (shadow.cljs.devtools.api/release-snapshot :the-build {})
@doglooksgood you can use the REPL to restart the build but its all a bit messy
you can try shadow-cljs clj-repl
(shadow.cljs.devtools.server/reload!)
if anything weird is happening
very strange, I found react
, react-dom
and shadow-cljs
in node_modules
become empty...
is there a way to dump the dependency graph so I can see where some dependencies are coming from?
will also be part of the UI. for CLJS you can do (shadow.cljs.devtools.api/find-resources-using-ns 'foo.bar)
hm. well something is going terribly awry when included pdf.js. it’s bundling the webworker
I’m including them very precisely like so:
["pdfjs-dist/lib/pdf.js" :as pdfjs]
["pdfjs-dist/web/pdf_viewer.js"]))
including the pre-built pdf.js actually reduces the total build, but it still includes the worker in the bundle somehow
fakeWorkerFilesLoader = useRequireEnsure ? function (callback) {
require.ensure([], function () {
var worker;
worker = require('./pdf.worker.js');
callback(worker.WorkerMessageHandler);
});
} : dynamicLoaderSupported ? function (callback) {
requirejs(['pdfjs-dist/build/pdf.worker'], function (worker) {
callback(worker.WorkerMessageHandler);
});
@lee.justin.m it appears that it has some kind of dynamic loading mechanism which the compiler cannot identify as dynamic
okay let me take a look at the docs. there is probably some stuff you have to do to make behave. this is a super complicated package
{
var isNodeJS = require('./shared/is_node.js');
if (isNodeJS()) {
var PDFNodeStream = require('./display/node_stream.js').PDFNodeStream;
pdfjsDisplayAPI.setPDFNetworkStreamFactory(function (params) {
return new PDFNodeStream(params);
});
} else if (typeof Response !== 'undefined' && 'body' in Response.prototype && typeof ReadableStream !== 'undefined') {
var PDFFetchStream = require('./display/fetch_stream.js').PDFFetchStream;
pdfjsDisplayAPI.setPDFNetworkStreamFactory(function (params) {
return new PDFFetchStream(params);
});
} else {
var PDFNetworkStream = require('./display/network.js').PDFNetworkStream;
pdfjsDisplayAPI.setPDFNetworkStreamFactory(function (params) {
return new PDFNetworkStream(params);
});
}
}
well you know i’m actually okay with it bundling the worker but i need to figure out how to start a worker using the bundled source. it is possible apparently
the default is not to use a worker at all if it is bundled and just doesn’t work because your UI is unusable
so somehow they got the main bundle and the worker bundle to build separately using webpack
~/test/pdf.js/examples/webpack$ npm run build
> [email protected] build /Users/justinlee/test/pdf.js/examples/webpack
> webpack
Hash: 9633d58ec3b79d0aaf96
Version: webpack 1.12.15
Time: 18903ms
Asset Size Chunks Chunk Names
main.bundle.js 397 kB 0 [emitted] main
1.1.bundle.js 704 kB 1 [emitted]
pdf.worker.bundle.js 706 kB 2, 1 [emitted] pdf.worker
[0] ./main.js 1.17 kB {0} [built]
+ 50 hidden modules
~/test/pdf.js/examples/webpack$ ls ../../build/webpack/
1.1.bundle.js main.bundle.js pdf.worker.bundle.js
~/test/pdf.js/examples/webpack$ ll ../../build/webpack/
total 1784
-rw-r--r-- 1 justinlee staff 708843 Feb 23 09:21 1.1.bundle.js
-rw-r--r-- 1 justinlee staff 397399 Feb 23 09:21 main.bundle.js
-rw-r--r-- 1 justinlee staff 710818 Feb 23 09:21 pdf.worker.bundle.js
all they do is list two entry points. one for main.js
, which does a var pdfjsLib = require('pdfjs-dist');
and one for the worker
require.ensure([], function () {
var worker;
worker = require('../pdf.worker.js');
callback(worker.WorkerMessageHandler);
});
yea in the browserify example they have to use a gulp task to ignore that line
gulp.task('build-bundle', function() {
return browserify('main.js', {output: TMP_FILE_PREFIX + 'main.tmp'})
.ignore(require.resolve('pdfjs-dist/build/pdf.worker')) // Reducing size
.bundle()
.pipe(source(TMP_FILE_PREFIX + 'main.tmp'))
.pipe(streamify(uglify()))
.pipe(rename('main.bundle.js'))
.pipe(gulp.dest(OUTPUT_PATH));
});
@lee.justin.m 2.1.25
should not include the worker anymore
(side note: vscode is pretty impressive. i went to update the version in package.json and the mouse-over already told me that 2.1.25 is the most recent version)
okay it is definitely eliding the worker. now i have to figure out what else broke. (I don’t think it is related)
okay so unfortunately that breaks pdf.js because what it does is goes and tried to load the worker code into the main thread https://github.com/mozilla/pdf.js/blob/99060e2485cacb8513e7bc50d88b70101069b1c9/src/display/api.js#L1478