Sure!
; + return(this.input = node)}>Sure!
; } } diff --git a/packages/react-tv/renderer/shared/DOMNamespaces.js b/packages/react-tv/renderer/shared/DOMNamespaces.js index 54d5e2b..fede898 100644 --- a/packages/react-tv/renderer/shared/DOMNamespaces.js +++ b/packages/react-tv/renderer/shared/DOMNamespaces.js @@ -1,5 +1,5 @@ /** - * Copyright (c) 2017-present, Raphael. + * Copyright (c) 2017-present, Raphael Amorim. * * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. @@ -11,14 +11,14 @@ const HTML_NAMESPACE = 'http://www.w3.org/1999/xhtml'; const MATH_NAMESPACE = 'http://www.w3.org/1998/Math/MathML'; const SVG_NAMESPACE = 'http://www.w3.org/2000/svg'; -const Namespaces = { +export const Namespaces = { html: HTML_NAMESPACE, mathml: MATH_NAMESPACE, svg: SVG_NAMESPACE, }; // Assumes there is no parent namespace. -function getIntrinsicNamespace(type: string): string { +export function getIntrinsicNamespace(type: string): string { switch (type) { case 'svg': return SVG_NAMESPACE; @@ -29,7 +29,7 @@ function getIntrinsicNamespace(type: string): string { } } -function getChildNamespace( +export function getChildNamespace( parentNamespace: string | null, type: string ): string { @@ -44,7 +44,3 @@ function getChildNamespace( // By default, pass namespace below. return parentNamespace; } - -exports.Namespaces = Namespaces; -exports.getIntrinsicNamespace = getIntrinsicNamespace; -exports.getChildNamespace = getChildNamespace; diff --git a/packages/react-tv/renderer/shared/utils/isCustomComponent.js b/packages/react-tv/renderer/shared/utils/isCustomComponent.js index 873dcb8..50bb921 100644 --- a/packages/react-tv/renderer/shared/utils/isCustomComponent.js +++ b/packages/react-tv/renderer/shared/utils/isCustomComponent.js @@ -31,4 +31,4 @@ function isCustomComponent(tagName: string, props: Object) { } } -module.exports = isCustomComponent; +export default isCustomComponent; diff --git a/scripts/benchmark/memory.js b/scripts/benchmark/memory.js new file mode 100644 index 0000000..4d77efb --- /dev/null +++ b/scripts/benchmark/memory.js @@ -0,0 +1,70 @@ +/*global React, ReactTV, ReactDOM*/ + +const inspect = require('./../../../memory-inspector'); + +const ReactPath = + '/Users/hamorim/Documents/life/react-tv/node_modules/react/umd/react.production.min.js'; +const ReactTVPath = + '/Users/hamorim/Documents/life/react-tv/packages/react-tv/dist/react-tv.production.js'; +const ReactDOMPath = + '/Users/hamorim/Documents/life/react-tv/node_modules/react-dom/umd/react-dom.production.min.js'; + +const renderApp = renderMethod => () => { + class Clock extends React.Component { + constructor() { + super(); + this.state = {date: new Date()}; + } + + componentDidMount() { + setInterval(() => this.setState({date: new Date()}), 1000); + } + + render() { + return React.createElement( + 'div', + {class: 'container'}, + React.createElement('img', {src: 'https://i.imgur.com/9yhDR0Q.png'}), + React.createElement( + 'h1', + null, + 'You ', + this.state.date.toLocaleTimeString() + ), + React.createElement('p', null, 'In Browser') + ); + } + } + + let render; + if (window && window.ReactTV) { + render = ReactTV.render; + console.log('using react-tv'); + } else { + render = ReactDOM.render; + console.log('using react-dom'); + } + + render(React.createElement(Clock, null), document.getElementById('root')); +}; + +// Should not pass 5MB +inspect({ + evaluate: renderApp, + scripts: [ReactPath, ReactTVPath], + delay: 1000, + maxMemoryLimit: 5 * 1048576, + maxMemoryPercentThreshold: 90, +}).then(memoryReportTV => { + console.log(memoryReportTV); + + inspect({ + evaluate: renderApp, + scripts: [ReactPath, ReactDOMPath], + delay: 3000, + maxMemoryLimit: 5 * 1048576, + maxMemoryPercentThreshold: 90, + }).then(memoryReportDOM => { + console.log(memoryReportDOM); + }); +}); diff --git a/scripts/rollup/build.js b/scripts/rollup/build.js index b2645a0..216cd54 100644 --- a/scripts/rollup/build.js +++ b/scripts/rollup/build.js @@ -14,10 +14,10 @@ const packagePath = 'packages/react-tv'; let tasks = []; -function stripEnvVariables(production) { +function stripEnvVariables(env) { return { - __DEV__: production ? 'false' : 'true', - 'process.env.NODE_ENV': production ? "'production'" : "'development'", + __DEV__: env === 'production' ? 'false' : 'true', + 'process.env.NODE_ENV': "'" + env + "'", }; } @@ -29,12 +29,14 @@ function createBundle({entryPath, bundleType, destName}) { let plugins = [ flow(), - replace(stripEnvVariables()), + replace(stripEnvVariables(bundleType)), babel({ exclude: 'node_modules/**', externalHelpers: false, }), - commonjs(), + commonjs({ + include: 'node_modules/**', + }), resolve({ jsnext: true, main: true, @@ -42,7 +44,7 @@ function createBundle({entryPath, bundleType, destName}) { }), ]; - if (bundleType.indexOf('PROD') >= 0) { + if (bundleType.indexOf('production') >= 0) { plugins = plugins.concat([optimizeJs(), uglify()]); } @@ -53,7 +55,7 @@ function createBundle({entryPath, bundleType, destName}) { }).then(bundle => { tasks.push( bundle.write({ - format: bundleType === 'PROD-UMD' ? 'umd' : 'iife', + format: 'umd', name: 'ReactTV', file: `${packagePath}/dist/${destName}`, }) @@ -61,31 +63,17 @@ function createBundle({entryPath, bundleType, destName}) { }); } -if (process.env.NODE_ENV === 'PROD') { - createBundle({ - entryPath: `${packagePath}/ReactTVEntry.js`, - bundleType: 'PROD', - destName: 'react-tv.min.js', - }); - - createBundle({ - entryPath: `${packagePath}/ReactTVEntry.js`, - bundleType: 'PROD-UMD', - destName: 'react-tv.umd.js', - }); -} else { - createBundle({ - entryPath: `${packagePath}/ReactTVEntry.js`, - bundleType: 'PROD-UMD', - destName: 'react-tv.umd.js', - }); +createBundle({ + entryPath: `${packagePath}/ReactTVEntry.js`, + bundleType: 'production', + destName: 'react-tv.production.js', +}); - // createBundle({ - // entryPath: `${packagePath}/ReactTVEntry.js`, - // bundleType: 'DEV', - // destName: 'react-tv.js', - // }); -} +createBundle({ + entryPath: `${packagePath}/ReactTVEntry.js`, + bundleType: 'development', + destName: 'react-tv.development.js', +}); Promise.all(tasks).catch(error => { Promise.reject(error); diff --git a/scripts/rollup/stats.js b/scripts/rollup/stats.js index 5a177af..6a0bb17 100644 --- a/scripts/rollup/stats.js +++ b/scripts/rollup/stats.js @@ -2,7 +2,7 @@ const fs = require('fs'); const path = require('path'); const Table = require('cli-table'); -const files = ['react-tv.umd.js', 'react-tv.min.js']; +const files = ['react-tv.development.js', 'react-tv.production.js']; const sizeInfo = ['size']; const table = new Table({