nativejsx icon indicating copy to clipboard operation
nativejsx copied to clipboard

Inline prototypes are added unconditionally to all modules

Open odzb opened this issue 8 years ago • 9 comments

It would be nice if inline prototypes were added only to modules that actually need the prototypes. Currently they are added to any module that is being processed by nativejsx, even to modules that don't have any JSX at all.

odzb avatar Feb 22 '17 10:02 odzb

Hey, mind giving 64360206ec5850ae0ac847db57483a4b1c8a28e3 a test run when you have the chance? It has file-by-file detection now.

treycordova avatar Feb 27 '17 05:02 treycordova

If it does what you'd like, I'll slice a new release with it.

treycordova avatar Feb 27 '17 05:02 treycordova

It now removes most, but not all, of unnecessary inline functions. It's not perfect, but it got better. I think it's worth a release, and then maybe someone can improve this further.

Thank you for your work! nativejsx is an awesome tool.

odzb avatar Feb 28 '17 18:02 odzb

Apparently, the changes in 6436020 do it right. It's issue #15 that causes code modifications to appear in unwanted places, which also causes inline functions to be inserted there.

odzb avatar Mar 02 '17 21:03 odzb

Alright, I've removed <noscript>. I'll be cutting a release of 4 after I confirm everything is OK with the build libraries like gulp, etc.

treycordova avatar Mar 04 '17 22:03 treycordova

4.0.0 is out, but I'm not so sure we've quite nailed this one. If you have time to vet the changes, that would be much appreciated.

treycordova avatar Mar 14 '17 06:03 treycordova

I can confirm that now I don't see these functions being added to modules where there is no JSX (at least in my codebase). But for it to be completely perfect, it would need to inline only those functions that are actually used in the module (e,g, if a particular module uses __setStyles, but doesn't use neither __setAttributes nor __appendChildren, then only __setStyles will be included).

Also I must say that I consider global prototypes a bad idea overall. At least not something to be enabled by default. If two modules on the page need different versions of the prototypes, or someone uses these method names for something else, bad things might happen. On my project I can totally see this happening. If you care about having to insert copies of the same functions in multiple places in the same Webpack bundle, you could put them in an NPM module that just exports the functions (instead of registering them in global prototypes). But inlines are also totally fine for me because they are small enough.

odzb avatar Mar 15 '17 12:03 odzb

There's a new setting to use module-based inclusion:

nativejsx.parse(jsx, {
  prototypes: 'module'
})

Which will require an import of necessary helpers in your JSX files:

import { setStyles } from 'nativejsx';

function template(styles) {
  return <div style={styles} />;
}

treycordova avatar Mar 27 '17 00:03 treycordova

I still prefer to inline this stuff. Now if only we could stop the Webpack loader from adding global prototypes all the time: https://github.com/treycordova/nativejsx-loader/issues/5

odzb avatar Mar 27 '17 10:03 odzb