GitPlanet

Cheap and reliable Node.js hosting starts at $3/month, and $1/month static HTML hosting

Created with love in Canada, visit hostnodejs.com today

Feel like to post an Ad? Learn Details
All Projects → A-gambit → Css In Js Benchmarks

A-gambit / Css In Js Benchmarks

Licence: apache-2.0

Programming Languages

javascript
184084 projects - #8 most used programming language
js
455 projects

Labels

cssreactbenchmarkstyled-componentscss-in-jsjsscalculationsinline-styles

Projects that are alternatives of or similar to Css In Js Benchmarks

Styled Tools
Useful interpolated functions for CSS-in-JS
Stars: ✭ 761 (+111.39%)
Mutual labels:  styled-components, css-in-js, jss
tsstyled
A small, fast, and simple CSS-in-JS solution for React.
Stars: ✭ 52 (-85.56%)
Mutual labels:  styled-components, css-in-js, jss
A Journey Toward Better Style
A Journey toward better style
Stars: ✭ 245 (-31.94%)
Mutual labels:  css-in-js, jss, inline-styles
Polished
A lightweight toolset for writing styles in JavaScript ✨
Stars: ✭ 7,074 (+1865%)
Mutual labels:  styled-components, css-in-js, inline-styles
react-native-css-in-js-benchmarks
CSS in JS Benchmarks for React Native
Stars: ✭ 46 (-87.22%)
Mutual labels:  benchmark, styled-components, css-in-js
Css In React
🍭 CSS in React - Learn the best CSS in JS frameworks by example
Stars: ✭ 101 (-71.94%)
Mutual labels:  styled-components, css-in-js, jss
Postjss
Use the power of PostCSS in compiling with JSS
Stars: ✭ 40 (-88.89%)
Mutual labels:  styled-components, css-in-js, jss
Css In Js
Autocomplete React Native / JS Styles and converting plain CSS to JS styles
Stars: ✭ 192 (-46.67%)
Mutual labels:  styled-components, css-in-js, jss
vue-jss-plugin
JSS plugin implementation for Vue.js
Stars: ✭ 24 (-93.33%)
Mutual labels:  css-in-js, jss
gloss
a powerful style system for building ui kits
Stars: ✭ 16 (-95.56%)
Mutual labels:  css-in-js, jss
tailed
Tailed is a tiny lib to add styled-components syntax like, with suport to conditional classes.
Stars: ✭ 79 (-78.06%)
Mutual labels:  styled-components, css-in-js
Arc
React starter kit based on Atomic Design
Stars: ✭ 2,780 (+672.22%)
Mutual labels:  styled-components, css-in-js
Styled Props
Simple lib that allows you to set styled props in your styled-components without stress.
Stars: ✭ 247 (-31.39%)
Mutual labels:  styled-components, css-in-js
jss-material-ui
A enhanced styling engine for material-ui
Stars: ✭ 15 (-95.83%)
Mutual labels:  styled-components, jss
Awesome Styled Components
A curated list of awesome styled-components resources 💅
Stars: ✭ 2,869 (+696.94%)
Mutual labels:  styled-components, css-in-js
Prejss
Get the power of PostCSS with plugins in your JSS styles. 🎨 Just put CSS into JS and get it as JSS object.
Stars: ✭ 238 (-33.89%)
Mutual labels:  styled-components, jss
linaria-styled
Zero-runtime CSS in JS library for building React components
Stars: ✭ 17 (-95.28%)
Mutual labels:  styled-components, css-in-js
Styled-Responsive-Media-Queries
Responsive Media Queries for Emotion styled or styled-components — Standard size from Chrome DevTools.
Stars: ✭ 33 (-90.83%)
Mutual labels:  styled-components, css-in-js
mediocre-pictures
Helping you take mediocre pictures, hands-free. 📷🙆🏻🙅🏾💁🏼📸
Stars: ✭ 16 (-95.56%)
Mutual labels:  styled-components, css-in-js
styled-components-docs-zh
💅 styled-components 中文文档翻译 🏇持续施工中
Stars: ✭ 160 (-55.56%)
Mutual labels:  styled-components, css-in-js
View All Similar Projects ➔

CSS in JS Benchmarks

Big Table

gif

Big Table examples, use:

  • react + css
  • aphrodite
  • glamorous
  • glam
  • fela
  • react-jss
  • radium
  • react-native-web
  • rockey
  • styled-components
  • styled-jsx
  • styletron
  • etc

Average results are here.

New demos and benchmarks will be soon :)

Contribution

Here is a little contributing guild:

  • Use node version ^7.9 (i.e. use 7.9 or newer, but not as new as 8)
  • Install lerna and yarn (optional)
  • lerna bootstrap or lerna bootstrap --npm-client=yarn - install deps in packages
  • npm i
  • lerna run build - make builds for all packages
  1. Create an appropriate folder for your CSS in JS new implementation. Use react as example of boilerplate.
  2. Add description for your CSS in JS in package.json. Example
  3. Add your solution for Table.js file.
  4. Run benchmarks: npm run benchmark. To tun tests for specific packageor - npm run benchmark -- rockey styled-jss radium

Add your favorite CSS in JS implementation! Your contributions and suggestions are heartily welcome. =^.^=

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].