From e81394c26e99f330fdc2563bee4870e9ea9df4eb Mon Sep 17 00:00:00 2001 From: Nicolas Gallagher Date: Sat, 25 Mar 2017 09:11:23 -0700 Subject: [PATCH] Add 'platform' benchmark The "platform" benchmark relies on no intermediate layer. All the static CSS it requires is inlined in the HTML page. --- .../css-modules/View/styles.css | 2 +- .../implementations/platform/Box/index.js | 17 ++++++++++ .../implementations/platform/View/index.js | 7 ++++ performance/implementations/platform/index.js | 7 ++++ performance/index.html | 33 +++++++++++++++++++ performance/index.js | 3 ++ 6 files changed, 68 insertions(+), 1 deletion(-) create mode 100644 performance/implementations/platform/Box/index.js create mode 100644 performance/implementations/platform/View/index.js create mode 100644 performance/implementations/platform/index.js diff --git a/performance/implementations/css-modules/View/styles.css b/performance/implementations/css-modules/View/styles.css index 74608166..37539f23 100644 --- a/performance/implementations/css-modules/View/styles.css +++ b/performance/implementations/css-modules/View/styles.css @@ -18,4 +18,4 @@ list-style: none; min-height: 0; min-width: 0; -}; +} diff --git a/performance/implementations/platform/Box/index.js b/performance/implementations/platform/Box/index.js new file mode 100644 index 00000000..7d5b9d1a --- /dev/null +++ b/performance/implementations/platform/Box/index.js @@ -0,0 +1,17 @@ +/* eslint-disable react/prop-types */ +import classnames from 'classnames'; +import React from 'react'; +import View from '../View'; + +const Box = ({ color, fixed = false, layout = 'column', outer = false, ...other }) => ( + +); + +module.exports = Box; diff --git a/performance/implementations/platform/View/index.js b/performance/implementations/platform/View/index.js new file mode 100644 index 00000000..cb70dbe0 --- /dev/null +++ b/performance/implementations/platform/View/index.js @@ -0,0 +1,7 @@ +/* eslint-disable react/prop-types */ +import classnames from 'classnames'; +import React from 'react'; + +const View = props =>
; + +module.exports = View; diff --git a/performance/implementations/platform/index.js b/performance/implementations/platform/index.js new file mode 100644 index 00000000..0ca161ab --- /dev/null +++ b/performance/implementations/platform/index.js @@ -0,0 +1,7 @@ +import Box from './Box'; +import View from './View'; + +export default { + Box, + View +}; diff --git a/performance/index.html b/performance/index.html index 28bfda18..4c4fe660 100644 --- a/performance/index.html +++ b/performance/index.html @@ -3,6 +3,39 @@ Title + +
diff --git a/performance/index.js b/performance/index.js index 9b213c60..5eb7f99f 100644 --- a/performance/index.js +++ b/performance/index.js @@ -1,5 +1,6 @@ import cssModules from './implementations/css-modules'; import glamor from './implementations/glamor'; +import platform from './implementations/platform'; import reactNative from './implementations/react-native-web'; import styledComponents from './implementations/styled-components'; @@ -8,11 +9,13 @@ import renderWideTree from './tests/renderWideTree'; const tests = [ // deep tree + () => renderDeepTree('platform', platform), () => renderDeepTree('css-modules', cssModules), () => renderDeepTree('react-native-web', reactNative), () => renderDeepTree('styled-components', styledComponents), () => renderDeepTree('glamor', glamor), // wide tree + () => renderWideTree('platform', platform), () => renderWideTree('css-modules', cssModules), () => renderWideTree('react-native-web', reactNative), () => renderWideTree('styled-components', styledComponents),