Preact benchmarks

performance/README.md

@@ -20,15 +20,21 @@ simple `View` without much of React Native's functionality.
 
 Typical render timings*: mean ± two standard deviations
 
-| Implementation                       | Deep tree (ms)    | Wide tree (ms)    | Tweets (ms)       |
+| React Implementation                 | Deep tree (ms)    | Wide tree (ms)    | Tweets (ms)       |
 | :--- | ---: | ---: | ---: |
 | `css-modules`                        |  `87.67` `±15.22` | `170.85` `±16.87` | |
 | `react-native-web/stylesheet@0.0.84` |  `90.02` `±13.16` | `186.66` `±19.23` | |
 | `react-native-web@0.0.84`            | `102.72` `±19.26` | `222.35` `±18.95` | `12.81` `±5.45ms` |
 
+| Preact Implementation                | Deep tree (ms)      | Wide tree (ms)      | Tweets (ms)       |
+| :--- | ---: | ---: | ---: |
+| `css-modules`                        |  `744.47` `±284.78` | `2006.23` `±214.00` | |
+| `react-native-web/stylesheet@0.0.86` | `1109.43` `±126.15` | `2677.19` `±301.84` | |
+| `react-native-web@0.0.86`            | `1601.87` `±207.56` | `3963.18` `±396.18` | `17.11` `±7.90ms` |
+
 Other libraries
 
-| Implementation                       | Deep tree (ms)    | Wide tree (ms)    |
+| React Implementation                       | Deep tree (ms)    | Wide tree (ms)    |
 | :--- | ---: | ---: |
 | `styletron@2.5.1`                    |  `88.48` `±12.00` | `171.89` `±13.28` |
 | `aphrodite@1.2.0`                    | `101.32` `±20.33` | `220.33` `±31.41` |

performance/index.js

@@ -6,7 +6,7 @@ import reactNative from './src/react-native';
 import reactNativeStyleSheet from './src/react-native-stylesheet';
 import styledComponents from './src/styled-components';
 import styletron from './src/styletron';
-import xp from './src/reactxp';
+// import xp from './src/reactxp';
 
 import renderDeepTree from './tests/renderDeepTree';
 import renderTweet from './tests/renderTweet';
@@ -37,8 +37,8 @@ const extraTests = [
   () => renderWideTree('glamor', glamor),
   () => renderDeepTree('react-jss', jss),
   () => renderWideTree('react-jss', jss),
-  () => renderDeepTree('reactxp', xp),
-  () => renderWideTree('reactxp', xp),
+  // () => renderDeepTree('reactxp', xp),
+  // () => renderWideTree('reactxp', xp),
   () => renderDeepTree('styled-components', styledComponents),
   () => renderWideTree('styled-components', styledComponents)
 ];

performance/package.json

@@ -6,6 +6,8 @@
     "classnames": "^2.2.5",
     "glamor": "3.0.0-1",
     "marky": "^1.2.0",
+    "preact": "^8.1.0",
+    "preact-compat": "^3.15.0",
     "react-jss": "^6.1.1",
     "reactxp": "^0.34.3",
     "styled-components": "2.0.0-15",

performance/webpack.config.js

@@ -49,7 +49,9 @@ module.exports = {
   ],
   resolve: {
     alias: {
-      'react-native': path.join(__dirname, '../src/module')
+      react: path.join(__dirname, 'node_modules/preact-compat/dist/preact-compat.js'),
+      'react-dom': path.join(__dirname, 'node_modules/preact-compat/dist/preact-compat.js'),
+      'react-native': path.join(__dirname, '../src')
     }
   }
 };

performance/yarn.lock

@@ -400,6 +400,12 @@ ifvisible.js@^1.0.6:
   version "1.0.6"
   resolved "https://registry.yarnpkg.com/ifvisible.js/-/ifvisible.js-1.0.6.tgz#52eb151ce89c56f15316226462e892d1f8451261"
 
+immutability-helper@^2.1.2:
+  version "2.1.2"
+  resolved "https://registry.yarnpkg.com/immutability-helper/-/immutability-helper-2.1.2.tgz#734506440d7209b74664dcadaa8ba14e73f2185b"
+  dependencies:
+    invariant "^2.2.0"
+
 indexes-of@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/indexes-of/-/indexes-of-1.0.1.tgz#f30f716c8e2bd346c7b67d3df3915566a7c05607"
@@ -422,6 +428,12 @@ inline-style-prefixer@^3.0.1:
     bowser "^1.6.0"
     css-in-js-utils "^1.0.3"
 
+invariant@^2.2.0:
+  version "2.2.2"
+  resolved "https://registry.yarnpkg.com/invariant/-/invariant-2.2.2.tgz#9e1f56ac0acdb6bf303306f338be3b204ae60360"
+  dependencies:
+    loose-envify "^1.0.0"
+
 is-absolute-url@^2.0.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/is-absolute-url/-/is-absolute-url-2.1.0.tgz#50530dfb84fcc9aa7dbe7852e83a37b93b9f2aa6"
@@ -871,10 +883,38 @@ postcss@^5.0.10, postcss@^5.0.11, postcss@^5.0.12, postcss@^5.0.13, postcss@^5.0
     source-map "^0.5.6"
     supports-color "^3.2.3"
 
+preact-compat@^3.15.0:
+  version "3.15.0"
+  resolved "https://registry.yarnpkg.com/preact-compat/-/preact-compat-3.15.0.tgz#b7818a3d0b20a8c9ca7c65ade0a60b01376902c1"
+  dependencies:
+    immutability-helper "^2.1.2"
+    preact-render-to-string "^3.6.0"
+    preact-transition-group "^1.1.0"
+    prop-types "^15.5.8"
+    standalone-react-addons-pure-render-mixin "^0.1.1"
+
+preact-render-to-string@^3.6.0:
+  version "3.6.0"
+  resolved "https://registry.yarnpkg.com/preact-render-to-string/-/preact-render-to-string-3.6.0.tgz#03a49d2d755a766c3d421e8b06d6edbb33ed6bde"
+  dependencies:
+    pretty-format "^3.5.1"
+
+preact-transition-group@^1.1.0:
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/preact-transition-group/-/preact-transition-group-1.1.1.tgz#f0a49327ea515ece34ea2be864c4a7d29e5d6e10"
+
+preact@^8.1.0:
+  version "8.1.0"
+  resolved "https://registry.yarnpkg.com/preact/-/preact-8.1.0.tgz#f035b808eebb74e46d56246b02ca0f190b6d6574"
+
 prepend-http@^1.0.0:
   version "1.0.4"
   resolved "https://registry.yarnpkg.com/prepend-http/-/prepend-http-1.0.4.tgz#d4f4562b0ce3696e41ac52d0e002e57a635dc6dc"
 
+pretty-format@^3.5.1:
+  version "3.8.0"
+  resolved "https://registry.yarnpkg.com/pretty-format/-/pretty-format-3.8.0.tgz#bfbed56d5e9a776645f4b1ff7aa1a3ac4fa3c385"
+
 promise@^7.1.1:
   version "7.1.1"
   resolved "https://registry.yarnpkg.com/promise/-/promise-7.1.1.tgz#489654c692616b8aa55b0724fa809bb7db49c5bf"
@@ -994,6 +1034,10 @@ sprintf-js@~1.0.2:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/sprintf-js/-/sprintf-js-1.0.3.tgz#04e6926f662895354f3dd015203633b857297e2c"
 
+standalone-react-addons-pure-render-mixin@^0.1.1:
+  version "0.1.1"
+  resolved "https://registry.yarnpkg.com/standalone-react-addons-pure-render-mixin/-/standalone-react-addons-pure-render-mixin-0.1.1.tgz#3c7409f4c79c40de9ac72c616cf679a994f37551"
+
 strict-uri-encode@^1.0.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/strict-uri-encode/-/strict-uri-encode-1.1.0.tgz#279b225df1d582b1f54e65addd4352e18faa0713"

src/modules/createDOMElement/index.js

@@ -1,4 +1,4 @@
-import '../injectResponderEventPlugin';
+// import '../injectResponderEventPlugin';
 
 import AccessibilityUtil from '../AccessibilityUtil';
 import createDOMProps from '../createDOMProps';