Nativescript-cli: Combine JavaScript files in a single file in release builds

[jasssonpet]

On iPhone 5 about 50ms of 980ms of the startup time of the Cuteness sample (and similar on Android) is spent for requiring JavaScript modules.

This could be reduced if we combine (and optionally minify) all used JavaScript modules in release build.

[ligaz]

This could be somehow related to the transpilers support #493

[teobugslayer]

Maybe we can work with @mishoo and use the excellent Uglify.js lib?

[Alphapage]

The problem seems to come from how page.xml code behind is managed.
From my test, it seems page.xml needs page.js (ie page.css) to find methods...

So the limitation is how to tell page.xml where to get navigatedTo for example.
Something like this:
< Page codeFile="path/to/the/bundlefile.js" codeClass="Mynamespace.Myclass" navigatedTo="pageNavigatedTo" />
or:
< Page codeFile="path/to/the/bundlefile.js" navigatedTo="Mynamespace.Myclass.pageNavigatedTo" />

For now, I'm unable to use this kind of folder structure in my app:

• scripts (all .js files)
• views (all .xml files)
• styles (all .css files)

this could solve my problem too.

[blagoev]

This can probably negativly reflect on how you debug and/or/when get error reports from production apps

[PanayotCankov]

Source Maps, Source Maps everywhere... We need to support these for obfuscators, transpilers etc.
Meanwhile we've spent some time profiling the app and improved our caching.

XML code-behind will be interesting, source maps won't handle that easily. They map the location in the generated JavaScript to the original source, however for the XMLs we will need a mapping that works the other way around.

[jasssonpet]

This is now possible with https://github.com/NativeScript/nativescript-dev-webpack

[jasssonpet]

Further things to research:

• [ ] Research integration with Core NativeScript apps
• [ ] HotReload (https://github.com/webpack/docs/wiki/hot-module-replacement-with-webpack)
• [ ] Debugger integration (including TypeScript and source maps)
• [ ] Packing and requiring other resources (XML, CSS) from within the bundle
• [ ] LiveSync - how will it work with the bundle
• [ ] Encryption - verify the plugin works with the bundler
• [ ] Android snapshot - how will it work with the bundle and encryption
• [ ] Android static binding generator - how will it work with the bundle and encryption

[jasssonpet]

Debugging issues:

• https://github.com/NativeScript/nativescript-vscode-extension/issues/55
• https://github.com/NativeScript/nativescript-vscode-extension/issues/56
• https://github.com/NativeScript/nativescript-vscode-extension/issues/59
• https://github.com/NativeScript/ios-runtime/issues/601
• Webpack source maps include all source contents, so this could be an issue with Angular (5MB map file).
• Webpack source map script URLs are generated with the webpack:// domain and this should be removed for the VS Code extension.
• Original JavaScript/TypeScript files should be present in the bundle for the iOS App inspector
• TypeScript loader conflicts with the NativeScript TypeScript plugin

Encryption issues:

• https://github.com/NativeScript/app-protection/issues/8
• https://github.com/NativeScript/app-protection/issues/12
• The generated bundle should be split in two and only user code should be encrypted.
• The decryption JavaScript file should not be deleted, bundled or encrypted.

Other issues:

• https://github.com/NativeScript/nativescript-cli/pull/1671#issuecomment-231713084
• https://github.com/NativeScript/nativescript-dev-webpack/issues/5
• Webpack should run in the platforms app folder, not in the root app folder
• Some hook ordering should be introduced to handle transpiling->bundling->static-bindings->encryption->snapshotting
• The --bundle flag logic can be moved from the CLI to the plugin somehow
• https://github.com/NativeScript/nativescript-dev-webpack/issues/7 - tns-java-classes is bundled for iOS applications
• https://github.com/NativeScript/nativescript-dev-webpack/issues/8 - Some files can't be resolved (.ios suffix is not removed); __extends issues

Running webpack with core NativeScript apps:

• https://github.com/NativeScript/nativescript-dev-webpack/issues/6 - All user JavaScript files should be registered with registerModule() for UI navigation to work
• http://fluentreports.com/blog/?p=342

[dtopuzov]

This should be resolved by nativescript-dev-webpack.