SlideShare a Scribd company logo
Will JS Kill CSS?
@bruno2ms
Bruno Mendes Soares
UX/UI Designer
SĂŁo Paulo, Brazil
/br2msi
/bruno2ms
FIRST
THINGS
FIRST1
React is a JavaScript library that helps with view
concerns in websites.
Virtual DOM
"React abstracts away the DOM from you, giving a simpler
programming model and better performance. React can also
render on the server using Node, and it can power native apps
using React Native."
What`s inside React.js
- Complexity to compare two trees is O(n^3) complexity
- React.js managed to turn O(n^3) problem into linear O(n)
- So it`s really fast
"This coupling is real, and it is unavoidable. We must bind event
listeners to elements on the page. We must update elements on
the page from our JavaScript. Our code must interact
bidirectionally and in real-time with the elements of the DOM.
... the mantra of React is to stop pretending the DOM and the
JavaScript that controls it are separate concerns."
— Keith J Grant
Inline CSS
You can fake and control states of your html component
combining CSS declarations and JS conditions.
What does
anyone have
against CSS?
Everything is global.
Selectors are matched against everything in the DOM.
CSS grows over time.
People are afraid of their own CSS. You can't just delete
things as it's so hard to know if it's absolutely safe to do
that.
You can be more dynamic with styles in a programming
language.
You can make really cool stuff with sass, but its not really
dynamic.
Cascade-less
The scary "global" nature of CSS is neutered. A module
over here is styled like this, a module over there is styled
like that - probably no conïŹ‚icts in sight.
All JavaScript
One sense I get is that some people just like and prefer
working in all JavaScript.
Dynamic Styles
"State" is largely a JavaScript concern. If you want/need
style to change based on dynamic conditions (states) on
your site,
What do you get out of inlining styles?
Colin Megill - Inline Styles are About to Kill CSS
https://www.youtube.com/watch?v=NoaxsCi13yQ
Do I have to
stop writing
CSS?
The facebook still has a CSS ïŹle

The Web WhatsApp too

Well 

Writed in July 2015 (Just to be sure)
What the
people says
about it?
Chris Coyier:
Some people really like this idea!
Lea Verou:
You can ïŹnd people in the world who like
eating excrement, it doesn't mean it's a
good idea.
Styling is what CSS is for
This is the "religious" angle that probably isn't
going to take us very far.
The separation of concerns is inherent to CSS.
It`s a ïŹle just for styling.
Inline styles are at the top of the speciïŹcity
spectrum.
The !important declaration can still win a speciïŹc
property/value styling war over an inline style, but
that's a slightly different concept and an even grosser
war to ïŹght.
Solution?
Some simple states are much easier in CSS
How do you do :hover/:focus/:active in inline
styles? You don't. You fake it.
Adding/removing classes is a perfect tool for
state changes already
CSS is successful because of it's simplicity.
Very simple learning curve to start (but not to
master).
In the other hand Styling in JS has the same
learning curve plus the REACT ïŹ‚ow.
Some of these "dynamic" styling concerns can
be solved with regular CSS.
calc()
viewport units
native variables
ïŹ‚ex grid
[
]
And what
about
progressive
enhancement?
tl;dr;
I hope not, and I don`t think so
Will JS kill CSS?
References
https://css-tricks.com/the-debate-around-do-we-even-need-css-anymore/
http://www.sitepoint.com/css-is-alive-and-well/
Ad

More Related Content

Viewers also liked (6)

The fuzzy line between design + development
The fuzzy line between design + developmentThe fuzzy line between design + development
The fuzzy line between design + development
Amanda Dorrell
 
Happier Teams Through Tools
Happier Teams Through ToolsHappier Teams Through Tools
Happier Teams Through Tools
Laura Frank Tacho
 
American English File 4 Student Book (Second Edition)
American English File 4 Student Book (Second Edition)American English File 4 Student Book (Second Edition)
American English File 4 Student Book (Second Edition)
Muse
 
An Introduction to Software Testing
An Introduction to Software TestingAn Introduction to Software Testing
An Introduction to Software Testing
Thorsten Frommen
 
American English File Starter Student Book (Second Edition)
American English File Starter Student Book (Second Edition)American English File Starter Student Book (Second Edition)
American English File Starter Student Book (Second Edition)
Muse
 
Groovy Grammar! Interesting ways to learn grammar!
Groovy Grammar! Interesting ways to learn grammar!Groovy Grammar! Interesting ways to learn grammar!
Groovy Grammar! Interesting ways to learn grammar!
Shelly Sanchez Terrell
 
The fuzzy line between design + development
The fuzzy line between design + developmentThe fuzzy line between design + development
The fuzzy line between design + development
Amanda Dorrell
 
Happier Teams Through Tools
Happier Teams Through ToolsHappier Teams Through Tools
Happier Teams Through Tools
Laura Frank Tacho
 
American English File 4 Student Book (Second Edition)
American English File 4 Student Book (Second Edition)American English File 4 Student Book (Second Edition)
American English File 4 Student Book (Second Edition)
Muse
 
An Introduction to Software Testing
An Introduction to Software TestingAn Introduction to Software Testing
An Introduction to Software Testing
Thorsten Frommen
 
American English File Starter Student Book (Second Edition)
American English File Starter Student Book (Second Edition)American English File Starter Student Book (Second Edition)
American English File Starter Student Book (Second Edition)
Muse
 
Groovy Grammar! Interesting ways to learn grammar!
Groovy Grammar! Interesting ways to learn grammar!Groovy Grammar! Interesting ways to learn grammar!
Groovy Grammar! Interesting ways to learn grammar!
Shelly Sanchez Terrell
 

Similar to Will js kill css (20)

Adapting to a Responsive Design at Untangle the Web on 29th July 2013
Adapting to a Responsive Design at Untangle the Web on 29th July 2013Adapting to a Responsive Design at Untangle the Web on 29th July 2013
Adapting to a Responsive Design at Untangle the Web on 29th July 2013
Matt Gibson
 
Web Design & UI/UX Bootcamp [Online & Offline] In Bangla
Web Design & UI/UX Bootcamp [Online & Offline] In BanglaWeb Design & UI/UX Bootcamp [Online & Offline] In Bangla
Web Design & UI/UX Bootcamp [Online & Offline] In Bangla
Stack Learner
 
Responsive Experience Design (RXD): A holistic approach to web - UXDEV Summit
Responsive Experience Design (RXD): A holistic approach to web - UXDEV SummitResponsive Experience Design (RXD): A holistic approach to web - UXDEV Summit
Responsive Experience Design (RXD): A holistic approach to web - UXDEV Summit
Mike Donahue
 
Stop Worrying & Get On With It (WDC Bristol 2009)
Stop Worrying & Get On With It (WDC Bristol 2009)Stop Worrying & Get On With It (WDC Bristol 2009)
Stop Worrying & Get On With It (WDC Bristol 2009)
elliotjaystocks
 
Stop Worrying & Get On With It (FOWD Tour 2009)
Stop Worrying & Get On With It (FOWD Tour 2009)Stop Worrying & Get On With It (FOWD Tour 2009)
Stop Worrying & Get On With It (FOWD Tour 2009)
elliotjaystocks
 
Is everything we used to do wrong?
Is everything we used to do wrong?Is everything we used to do wrong?
Is everything we used to do wrong?
Russ Weakley
 
FOWD NYC 2009
FOWD NYC 2009FOWD NYC 2009
FOWD NYC 2009
elliotjaystocks
 
Intro to BackboneJS + Intermediate Javascript
Intro to BackboneJS + Intermediate JavascriptIntro to BackboneJS + Intermediate Javascript
Intro to BackboneJS + Intermediate Javascript
Andrew Lovett-Barron
 
Http _css-tricks
Http  _css-tricksHttp  _css-tricks
Http _css-tricks
Daniel Downs
 
Aaug sample slides
Aaug sample slidesAaug sample slides
Aaug sample slides
Casandra Calo
 
Responsive Design: Out of the Box and Down the Rabbit Hole
Responsive Design: Out of the Box and Down the Rabbit HoleResponsive Design: Out of the Box and Down the Rabbit Hole
Responsive Design: Out of the Box and Down the Rabbit Hole
Dan Moriarty
 
CSS vs. JavaScript - Trust vs. Control
CSS vs. JavaScript - Trust vs. ControlCSS vs. JavaScript - Trust vs. Control
CSS vs. JavaScript - Trust vs. Control
Christian Heilmann
 
JavaScript Architectures
JavaScript ArchitecturesJavaScript Architectures
JavaScript Architectures
Jason Yeo Jie Shun
 
A Day Building Fast, Responsive, Extensible Single Page Applications
A Day Building Fast, Responsive, Extensible Single Page ApplicationsA Day Building Fast, Responsive, Extensible Single Page Applications
A Day Building Fast, Responsive, Extensible Single Page Applications
Chris Love
 
Maintainable Javascript carsonified
Maintainable Javascript carsonifiedMaintainable Javascript carsonified
Maintainable Javascript carsonified
Christian Heilmann
 
The State of Front-end At CrowdTwist
The State of Front-end At CrowdTwistThe State of Front-end At CrowdTwist
The State of Front-end At CrowdTwist
Mark Fayngersh
 
Beginning CSS.
Beginning CSS.Beginning CSS.
Beginning CSS.
dhruvgairola
 
Building Web Applications Without a Framework
Building Web Applications Without a FrameworkBuilding Web Applications Without a Framework
Building Web Applications Without a Framework
All Things Open
 
Building Rich User Experiences Without JavaScript Spaghetti
Building Rich User Experiences Without JavaScript SpaghettiBuilding Rich User Experiences Without JavaScript Spaghetti
Building Rich User Experiences Without JavaScript Spaghetti
Jared Faris
 
Bootstrap for Beginners
Bootstrap for BeginnersBootstrap for Beginners
Bootstrap for Beginners
D'arce Hess
 
Adapting to a Responsive Design at Untangle the Web on 29th July 2013
Adapting to a Responsive Design at Untangle the Web on 29th July 2013Adapting to a Responsive Design at Untangle the Web on 29th July 2013
Adapting to a Responsive Design at Untangle the Web on 29th July 2013
Matt Gibson
 
Web Design & UI/UX Bootcamp [Online & Offline] In Bangla
Web Design & UI/UX Bootcamp [Online & Offline] In BanglaWeb Design & UI/UX Bootcamp [Online & Offline] In Bangla
Web Design & UI/UX Bootcamp [Online & Offline] In Bangla
Stack Learner
 
Responsive Experience Design (RXD): A holistic approach to web - UXDEV Summit
Responsive Experience Design (RXD): A holistic approach to web - UXDEV SummitResponsive Experience Design (RXD): A holistic approach to web - UXDEV Summit
Responsive Experience Design (RXD): A holistic approach to web - UXDEV Summit
Mike Donahue
 
Stop Worrying & Get On With It (WDC Bristol 2009)
Stop Worrying & Get On With It (WDC Bristol 2009)Stop Worrying & Get On With It (WDC Bristol 2009)
Stop Worrying & Get On With It (WDC Bristol 2009)
elliotjaystocks
 
Stop Worrying & Get On With It (FOWD Tour 2009)
Stop Worrying & Get On With It (FOWD Tour 2009)Stop Worrying & Get On With It (FOWD Tour 2009)
Stop Worrying & Get On With It (FOWD Tour 2009)
elliotjaystocks
 
Is everything we used to do wrong?
Is everything we used to do wrong?Is everything we used to do wrong?
Is everything we used to do wrong?
Russ Weakley
 
Intro to BackboneJS + Intermediate Javascript
Intro to BackboneJS + Intermediate JavascriptIntro to BackboneJS + Intermediate Javascript
Intro to BackboneJS + Intermediate Javascript
Andrew Lovett-Barron
 
Http _css-tricks
Http  _css-tricksHttp  _css-tricks
Http _css-tricks
Daniel Downs
 
Aaug sample slides
Aaug sample slidesAaug sample slides
Aaug sample slides
Casandra Calo
 
Responsive Design: Out of the Box and Down the Rabbit Hole
Responsive Design: Out of the Box and Down the Rabbit HoleResponsive Design: Out of the Box and Down the Rabbit Hole
Responsive Design: Out of the Box and Down the Rabbit Hole
Dan Moriarty
 
CSS vs. JavaScript - Trust vs. Control
CSS vs. JavaScript - Trust vs. ControlCSS vs. JavaScript - Trust vs. Control
CSS vs. JavaScript - Trust vs. Control
Christian Heilmann
 
JavaScript Architectures
JavaScript ArchitecturesJavaScript Architectures
JavaScript Architectures
Jason Yeo Jie Shun
 
A Day Building Fast, Responsive, Extensible Single Page Applications
A Day Building Fast, Responsive, Extensible Single Page ApplicationsA Day Building Fast, Responsive, Extensible Single Page Applications
A Day Building Fast, Responsive, Extensible Single Page Applications
Chris Love
 
Maintainable Javascript carsonified
Maintainable Javascript carsonifiedMaintainable Javascript carsonified
Maintainable Javascript carsonified
Christian Heilmann
 
The State of Front-end At CrowdTwist
The State of Front-end At CrowdTwistThe State of Front-end At CrowdTwist
The State of Front-end At CrowdTwist
Mark Fayngersh
 
Beginning CSS.
Beginning CSS.Beginning CSS.
Beginning CSS.
dhruvgairola
 
Building Web Applications Without a Framework
Building Web Applications Without a FrameworkBuilding Web Applications Without a Framework
Building Web Applications Without a Framework
All Things Open
 
Building Rich User Experiences Without JavaScript Spaghetti
Building Rich User Experiences Without JavaScript SpaghettiBuilding Rich User Experiences Without JavaScript Spaghetti
Building Rich User Experiences Without JavaScript Spaghetti
Jared Faris
 
Bootstrap for Beginners
Bootstrap for BeginnersBootstrap for Beginners
Bootstrap for Beginners
D'arce Hess
 
Ad

More from Bruno Mendes (16)

Google Design sprint
Google Design sprintGoogle Design sprint
Google Design sprint
Bruno Mendes
 
Ux is not UI
Ux is not UIUx is not UI
Ux is not UI
Bruno Mendes
 
Building a ux team
Building a ux team Building a ux team
Building a ux team
Bruno Mendes
 
Ciência do conforto
Ciência do confortoCiência do conforto
Ciência do conforto
Bruno Mendes
 
Jekyll - Liquid for noobs
Jekyll - Liquid for noobsJekyll - Liquid for noobs
Jekyll - Liquid for noobs
Bruno Mendes
 
Jekyll
JekyllJekyll
Jekyll
Bruno Mendes
 
Como falhar como lĂ­der
Como falhar como lĂ­derComo falhar como lĂ­der
Como falhar como lĂ­der
Bruno Mendes
 
Pomodoro technique
Pomodoro techniquePomodoro technique
Pomodoro technique
Bruno Mendes
 
Fisica da agilidade
Fisica da agilidadeFisica da agilidade
Fisica da agilidade
Bruno Mendes
 
Personas: O que sĂŁo? Onde vivem? Como funcionam?
Personas: O que sĂŁo? Onde vivem? Como funcionam?Personas: O que sĂŁo? Onde vivem? Como funcionam?
Personas: O que sĂŁo? Onde vivem? Como funcionam?
Bruno Mendes
 
Pense como dono
Pense como donoPense como dono
Pense como dono
Bruno Mendes
 
Fatores Cesar no Atendimento Ao Cliente
Fatores Cesar no Atendimento Ao ClienteFatores Cesar no Atendimento Ao Cliente
Fatores Cesar no Atendimento Ao Cliente
Bruno Mendes
 
Montes Claros - Cursar tecnologia no interior de Minas Gerais
Montes Claros - Cursar tecnologia no interior de Minas GeraisMontes Claros - Cursar tecnologia no interior de Minas Gerais
Montes Claros - Cursar tecnologia no interior de Minas Gerais
Bruno Mendes
 
OOCSS
OOCSSOOCSS
OOCSS
Bruno Mendes
 
Why SASS - in 10 minutos
Why SASS - in 10 minutosWhy SASS - in 10 minutos
Why SASS - in 10 minutos
Bruno Mendes
 
Lean ux
Lean uxLean ux
Lean ux
Bruno Mendes
 
Google Design sprint
Google Design sprintGoogle Design sprint
Google Design sprint
Bruno Mendes
 
Ux is not UI
Ux is not UIUx is not UI
Ux is not UI
Bruno Mendes
 
Building a ux team
Building a ux team Building a ux team
Building a ux team
Bruno Mendes
 
Ciência do conforto
Ciência do confortoCiência do conforto
Ciência do conforto
Bruno Mendes
 
Jekyll - Liquid for noobs
Jekyll - Liquid for noobsJekyll - Liquid for noobs
Jekyll - Liquid for noobs
Bruno Mendes
 
Como falhar como lĂ­der
Como falhar como lĂ­derComo falhar como lĂ­der
Como falhar como lĂ­der
Bruno Mendes
 
Pomodoro technique
Pomodoro techniquePomodoro technique
Pomodoro technique
Bruno Mendes
 
Fisica da agilidade
Fisica da agilidadeFisica da agilidade
Fisica da agilidade
Bruno Mendes
 
Personas: O que sĂŁo? Onde vivem? Como funcionam?
Personas: O que sĂŁo? Onde vivem? Como funcionam?Personas: O que sĂŁo? Onde vivem? Como funcionam?
Personas: O que sĂŁo? Onde vivem? Como funcionam?
Bruno Mendes
 
Pense como dono
Pense como donoPense como dono
Pense como dono
Bruno Mendes
 
Fatores Cesar no Atendimento Ao Cliente
Fatores Cesar no Atendimento Ao ClienteFatores Cesar no Atendimento Ao Cliente
Fatores Cesar no Atendimento Ao Cliente
Bruno Mendes
 
Montes Claros - Cursar tecnologia no interior de Minas Gerais
Montes Claros - Cursar tecnologia no interior de Minas GeraisMontes Claros - Cursar tecnologia no interior de Minas Gerais
Montes Claros - Cursar tecnologia no interior de Minas Gerais
Bruno Mendes
 
Why SASS - in 10 minutos
Why SASS - in 10 minutosWhy SASS - in 10 minutos
Why SASS - in 10 minutos
Bruno Mendes
 
Ad

Recently uploaded (20)

How to Optimize Your AWS Environment for Improved Cloud Performance
How to Optimize Your AWS Environment for Improved Cloud PerformanceHow to Optimize Your AWS Environment for Improved Cloud Performance
How to Optimize Your AWS Environment for Improved Cloud Performance
ThousandEyes
 
What Do Contribution Guidelines Say About Software Testing? (MSR 2025)
What Do Contribution Guidelines Say About Software Testing? (MSR 2025)What Do Contribution Guidelines Say About Software Testing? (MSR 2025)
What Do Contribution Guidelines Say About Software Testing? (MSR 2025)
Andre Hora
 
Get & Download Wondershare Filmora Crack Latest [2025]
Get & Download Wondershare Filmora Crack Latest [2025]Get & Download Wondershare Filmora Crack Latest [2025]
Get & Download Wondershare Filmora Crack Latest [2025]
saniaaftab72555
 
Adobe Master Collection CC Crack Advance Version 2025
Adobe Master Collection CC Crack Advance Version 2025Adobe Master Collection CC Crack Advance Version 2025
Adobe Master Collection CC Crack Advance Version 2025
kashifyounis067
 
Exceptional Behaviors: How Frequently Are They Tested? (AST 2025)
Exceptional Behaviors: How Frequently Are They Tested? (AST 2025)Exceptional Behaviors: How Frequently Are They Tested? (AST 2025)
Exceptional Behaviors: How Frequently Are They Tested? (AST 2025)
Andre Hora
 
Expand your AI adoption with AgentExchange
Expand your AI adoption with AgentExchangeExpand your AI adoption with AgentExchange
Expand your AI adoption with AgentExchange
Fexle Services Pvt. Ltd.
 
Why Orangescrum Is a Game Changer for Construction Companies in 2025
Why Orangescrum Is a Game Changer for Construction Companies in 2025Why Orangescrum Is a Game Changer for Construction Companies in 2025
Why Orangescrum Is a Game Changer for Construction Companies in 2025
Orangescrum
 
Revolutionizing Residential Wi-Fi PPT.pptx
Revolutionizing Residential Wi-Fi PPT.pptxRevolutionizing Residential Wi-Fi PPT.pptx
Revolutionizing Residential Wi-Fi PPT.pptx
nidhisingh691197
 
Societal challenges of AI: biases, multilinguism and sustainability
Societal challenges of AI: biases, multilinguism and sustainabilitySocietal challenges of AI: biases, multilinguism and sustainability
Societal challenges of AI: biases, multilinguism and sustainability
Jordi Cabot
 
Landscape of Requirements Engineering for/by AI through Literature Review
Landscape of Requirements Engineering for/by AI through Literature ReviewLandscape of Requirements Engineering for/by AI through Literature Review
Landscape of Requirements Engineering for/by AI through Literature Review
Hironori Washizaki
 
Requirements in Engineering AI- Enabled Systems: Open Problems and Safe AI Sy...
Requirements in Engineering AI- Enabled Systems: Open Problems and Safe AI Sy...Requirements in Engineering AI- Enabled Systems: Open Problems and Safe AI Sy...
Requirements in Engineering AI- Enabled Systems: Open Problems and Safe AI Sy...
Lionel Briand
 
Secure Test Infrastructure: The Backbone of Trustworthy Software Development
Secure Test Infrastructure: The Backbone of Trustworthy Software DevelopmentSecure Test Infrastructure: The Backbone of Trustworthy Software Development
Secure Test Infrastructure: The Backbone of Trustworthy Software Development
Shubham Joshi
 
FL Studio Producer Edition Crack 2025 Full Version
FL Studio Producer Edition Crack 2025 Full VersionFL Studio Producer Edition Crack 2025 Full Version
FL Studio Producer Edition Crack 2025 Full Version
tahirabibi60507
 
Avast Premium Security Crack FREE Latest Version 2025
Avast Premium Security Crack FREE Latest Version 2025Avast Premium Security Crack FREE Latest Version 2025
Avast Premium Security Crack FREE Latest Version 2025
mu394968
 
Adobe Marketo Engage Champion Deep Dive - SFDC CRM Synch V2 & Usage Dashboards
Adobe Marketo Engage Champion Deep Dive - SFDC CRM Synch V2 & Usage DashboardsAdobe Marketo Engage Champion Deep Dive - SFDC CRM Synch V2 & Usage Dashboards
Adobe Marketo Engage Champion Deep Dive - SFDC CRM Synch V2 & Usage Dashboards
BradBedford3
 
Proactive Vulnerability Detection in Source Code Using Graph Neural Networks:...
Proactive Vulnerability Detection in Source Code Using Graph Neural Networks:...Proactive Vulnerability Detection in Source Code Using Graph Neural Networks:...
Proactive Vulnerability Detection in Source Code Using Graph Neural Networks:...
Ranjan Baisak
 
Exploring Wayland: A Modern Display Server for the Future
Exploring Wayland: A Modern Display Server for the FutureExploring Wayland: A Modern Display Server for the Future
Exploring Wayland: A Modern Display Server for the Future
ICS
 
Douwan Crack 2025 new verson+ License code
Douwan Crack 2025 new verson+ License codeDouwan Crack 2025 new verson+ License code
Douwan Crack 2025 new verson+ License code
aneelaramzan63
 
Kubernetes_101_Zero_to_Platform_Engineer.pptx
Kubernetes_101_Zero_to_Platform_Engineer.pptxKubernetes_101_Zero_to_Platform_Engineer.pptx
Kubernetes_101_Zero_to_Platform_Engineer.pptx
CloudScouts
 
EASEUS Partition Master Crack + License Code
EASEUS Partition Master Crack + License CodeEASEUS Partition Master Crack + License Code
EASEUS Partition Master Crack + License Code
aneelaramzan63
 
How to Optimize Your AWS Environment for Improved Cloud Performance
How to Optimize Your AWS Environment for Improved Cloud PerformanceHow to Optimize Your AWS Environment for Improved Cloud Performance
How to Optimize Your AWS Environment for Improved Cloud Performance
ThousandEyes
 
What Do Contribution Guidelines Say About Software Testing? (MSR 2025)
What Do Contribution Guidelines Say About Software Testing? (MSR 2025)What Do Contribution Guidelines Say About Software Testing? (MSR 2025)
What Do Contribution Guidelines Say About Software Testing? (MSR 2025)
Andre Hora
 
Get & Download Wondershare Filmora Crack Latest [2025]
Get & Download Wondershare Filmora Crack Latest [2025]Get & Download Wondershare Filmora Crack Latest [2025]
Get & Download Wondershare Filmora Crack Latest [2025]
saniaaftab72555
 
Adobe Master Collection CC Crack Advance Version 2025
Adobe Master Collection CC Crack Advance Version 2025Adobe Master Collection CC Crack Advance Version 2025
Adobe Master Collection CC Crack Advance Version 2025
kashifyounis067
 
Exceptional Behaviors: How Frequently Are They Tested? (AST 2025)
Exceptional Behaviors: How Frequently Are They Tested? (AST 2025)Exceptional Behaviors: How Frequently Are They Tested? (AST 2025)
Exceptional Behaviors: How Frequently Are They Tested? (AST 2025)
Andre Hora
 
Expand your AI adoption with AgentExchange
Expand your AI adoption with AgentExchangeExpand your AI adoption with AgentExchange
Expand your AI adoption with AgentExchange
Fexle Services Pvt. Ltd.
 
Why Orangescrum Is a Game Changer for Construction Companies in 2025
Why Orangescrum Is a Game Changer for Construction Companies in 2025Why Orangescrum Is a Game Changer for Construction Companies in 2025
Why Orangescrum Is a Game Changer for Construction Companies in 2025
Orangescrum
 
Revolutionizing Residential Wi-Fi PPT.pptx
Revolutionizing Residential Wi-Fi PPT.pptxRevolutionizing Residential Wi-Fi PPT.pptx
Revolutionizing Residential Wi-Fi PPT.pptx
nidhisingh691197
 
Societal challenges of AI: biases, multilinguism and sustainability
Societal challenges of AI: biases, multilinguism and sustainabilitySocietal challenges of AI: biases, multilinguism and sustainability
Societal challenges of AI: biases, multilinguism and sustainability
Jordi Cabot
 
Landscape of Requirements Engineering for/by AI through Literature Review
Landscape of Requirements Engineering for/by AI through Literature ReviewLandscape of Requirements Engineering for/by AI through Literature Review
Landscape of Requirements Engineering for/by AI through Literature Review
Hironori Washizaki
 
Requirements in Engineering AI- Enabled Systems: Open Problems and Safe AI Sy...
Requirements in Engineering AI- Enabled Systems: Open Problems and Safe AI Sy...Requirements in Engineering AI- Enabled Systems: Open Problems and Safe AI Sy...
Requirements in Engineering AI- Enabled Systems: Open Problems and Safe AI Sy...
Lionel Briand
 
Secure Test Infrastructure: The Backbone of Trustworthy Software Development
Secure Test Infrastructure: The Backbone of Trustworthy Software DevelopmentSecure Test Infrastructure: The Backbone of Trustworthy Software Development
Secure Test Infrastructure: The Backbone of Trustworthy Software Development
Shubham Joshi
 
FL Studio Producer Edition Crack 2025 Full Version
FL Studio Producer Edition Crack 2025 Full VersionFL Studio Producer Edition Crack 2025 Full Version
FL Studio Producer Edition Crack 2025 Full Version
tahirabibi60507
 
Avast Premium Security Crack FREE Latest Version 2025
Avast Premium Security Crack FREE Latest Version 2025Avast Premium Security Crack FREE Latest Version 2025
Avast Premium Security Crack FREE Latest Version 2025
mu394968
 
Adobe Marketo Engage Champion Deep Dive - SFDC CRM Synch V2 & Usage Dashboards
Adobe Marketo Engage Champion Deep Dive - SFDC CRM Synch V2 & Usage DashboardsAdobe Marketo Engage Champion Deep Dive - SFDC CRM Synch V2 & Usage Dashboards
Adobe Marketo Engage Champion Deep Dive - SFDC CRM Synch V2 & Usage Dashboards
BradBedford3
 
Proactive Vulnerability Detection in Source Code Using Graph Neural Networks:...
Proactive Vulnerability Detection in Source Code Using Graph Neural Networks:...Proactive Vulnerability Detection in Source Code Using Graph Neural Networks:...
Proactive Vulnerability Detection in Source Code Using Graph Neural Networks:...
Ranjan Baisak
 
Exploring Wayland: A Modern Display Server for the Future
Exploring Wayland: A Modern Display Server for the FutureExploring Wayland: A Modern Display Server for the Future
Exploring Wayland: A Modern Display Server for the Future
ICS
 
Douwan Crack 2025 new verson+ License code
Douwan Crack 2025 new verson+ License codeDouwan Crack 2025 new verson+ License code
Douwan Crack 2025 new verson+ License code
aneelaramzan63
 
Kubernetes_101_Zero_to_Platform_Engineer.pptx
Kubernetes_101_Zero_to_Platform_Engineer.pptxKubernetes_101_Zero_to_Platform_Engineer.pptx
Kubernetes_101_Zero_to_Platform_Engineer.pptx
CloudScouts
 
EASEUS Partition Master Crack + License Code
EASEUS Partition Master Crack + License CodeEASEUS Partition Master Crack + License Code
EASEUS Partition Master Crack + License Code
aneelaramzan63
 

Will js kill css

  • 2. @bruno2ms Bruno Mendes Soares UX/UI Designer SĂŁo Paulo, Brazil /br2msi /bruno2ms
  • 4. React is a JavaScript library that helps with view concerns in websites.
  • 5. Virtual DOM "React abstracts away the DOM from you, giving a simpler programming model and better performance. React can also render on the server using Node, and it can power native apps using React Native."
  • 6. What`s inside React.js - Complexity to compare two trees is O(n^3) complexity - React.js managed to turn O(n^3) problem into linear O(n) - So it`s really fast
  • 7. "This coupling is real, and it is unavoidable. We must bind event listeners to elements on the page. We must update elements on the page from our JavaScript. Our code must interact bidirectionally and in real-time with the elements of the DOM. ... the mantra of React is to stop pretending the DOM and the JavaScript that controls it are separate concerns." — Keith J Grant
  • 8. Inline CSS You can fake and control states of your html component combining CSS declarations and JS conditions.
  • 10. Everything is global. Selectors are matched against everything in the DOM. CSS grows over time. People are afraid of their own CSS. You can't just delete things as it's so hard to know if it's absolutely safe to do that. You can be more dynamic with styles in a programming language. You can make really cool stuff with sass, but its not really dynamic.
  • 11. Cascade-less The scary "global" nature of CSS is neutered. A module over here is styled like this, a module over there is styled like that - probably no conïŹ‚icts in sight. All JavaScript One sense I get is that some people just like and prefer working in all JavaScript. Dynamic Styles "State" is largely a JavaScript concern. If you want/need style to change based on dynamic conditions (states) on your site, What do you get out of inlining styles?
  • 12. Colin Megill - Inline Styles are About to Kill CSS https://www.youtube.com/watch?v=NoaxsCi13yQ
  • 13. Do I have to stop writing CSS?
  • 14. The facebook still has a CSS ïŹle
 The Web WhatsApp too
 Well 
 Writed in July 2015 (Just to be sure)
  • 16. Chris Coyier: Some people really like this idea! Lea Verou: You can ïŹnd people in the world who like eating excrement, it doesn't mean it's a good idea.
  • 17. Styling is what CSS is for This is the "religious" angle that probably isn't going to take us very far. The separation of concerns is inherent to CSS. It`s a ïŹle just for styling.
  • 18. Inline styles are at the top of the speciïŹcity spectrum. The !important declaration can still win a speciïŹc property/value styling war over an inline style, but that's a slightly different concept and an even grosser war to ïŹght.
  • 20. Some simple states are much easier in CSS How do you do :hover/:focus/:active in inline styles? You don't. You fake it. Adding/removing classes is a perfect tool for state changes already
  • 21. CSS is successful because of it's simplicity. Very simple learning curve to start (but not to master). In the other hand Styling in JS has the same learning curve plus the REACT ïŹ‚ow.
  • 22. Some of these "dynamic" styling concerns can be solved with regular CSS. calc() viewport units native variables ïŹ‚ex grid [
]
  • 24. tl;dr; I hope not, and I don`t think so Will JS kill CSS?