SlideShare a Scribd company logo
1 of 40
Download to read offline
component
Tim Oxley
•Twitter: @secoif
•Github: github.com/timoxley
•secoif@gmail.com
•meetup.com/singapore-js
•campjs.com
Singapore JS
Monday 4th March
nodejs workshops
    coming soon
component
say no to invasive frameworks
a world without jQuery?
nodejs-style modules for the
          browser
do one thing well
  unix philosphy
component/inherit
module.exports = function(a, b){
  var fn = function(){};
  fn.prototype = b.prototype;
  a.prototype = new fn;
  a.prototype.constructor = a;
};
component/domify
var domify = require('domify')
domify('<p>Hello</p><p>World</p>')
// => [<p>Hello</p><p>World</p>]
500+ Components
https://github.com/component/component/wiki/Components
•AJAX                   •Function Utilities   •Templating
•WebSocket              •Date Utilities       •Audio
•Routing                •Array Utilities      •Other
•CQRS                   •String Utilities     •MVC
•Data Modelling         •Number Utilities     •Backbone
•Data Structures        •Math Utilities       •Ember
•Dependency Injection   •Object Utilities     •Gaming
•UI Elements            •Canvas               •Themes
•DOM Interaction        •Shims
•Conversion Utilities   •Testing
•Control Flow           •Styling
diversity leads to innovation
invest in a framework vs.
  invest in components
what if component isn’t the
     perfect solution?
worst case scenario?
frameworks:
vendor lock-in
fragmentation
useless knowledge
useless code
one size does not fit all
frameworks have a lifespan
heavy to pivot
vs components
modular codebase
custom architecture
more decisions
component is just a build tool
         + require shim
specify and bundle
  dependencies
lightweight
isolate complexity
ecosystem agnostic
It’s not just the web anymore
encourage healthy coding
       practices
easier to pivot
only constant is change
leverage, don’t lean
open source all the things
components = everybody wins
Questions?

http://github.com/timoxley



        @secoif

More Related Content

What's hot

SharePoint Saturday Twin Cities - SharePoint Framework, Angular & Azure Funct...
SharePoint Saturday Twin Cities - SharePoint Framework, Angular & Azure Funct...SharePoint Saturday Twin Cities - SharePoint Framework, Angular & Azure Funct...
SharePoint Saturday Twin Cities - SharePoint Framework, Angular & Azure Funct...
Sébastien Levert
 
Native Script by Sebastian Witalec
Native Script by Sebastian WitalecNative Script by Sebastian Witalec
Native Script by Sebastian Witalec
Simone Basso
 

What's hot (20)

Back to the ng2 Future
Back to the ng2 FutureBack to the ng2 Future
Back to the ng2 Future
 
Untangling spring week9
Untangling spring week9Untangling spring week9
Untangling spring week9
 
SharePoint Saturday Twin Cities - SharePoint Framework, Angular & Azure Funct...
SharePoint Saturday Twin Cities - SharePoint Framework, Angular & Azure Funct...SharePoint Saturday Twin Cities - SharePoint Framework, Angular & Azure Funct...
SharePoint Saturday Twin Cities - SharePoint Framework, Angular & Azure Funct...
 
Cross Platform Angular 2 and TypeScript Development
Cross Platform Angular 2 and TypeScript DevelopmentCross Platform Angular 2 and TypeScript Development
Cross Platform Angular 2 and TypeScript Development
 
Native Script by Sebastian Witalec
Native Script by Sebastian WitalecNative Script by Sebastian Witalec
Native Script by Sebastian Witalec
 
Html5
Html5Html5
Html5
 
My Contributor Story
My Contributor StoryMy Contributor Story
My Contributor Story
 
Untangling spring week8
Untangling spring week8Untangling spring week8
Untangling spring week8
 
Untangling spring week10
Untangling spring week10Untangling spring week10
Untangling spring week10
 
Introduce Angular2 & render & firebase flow
Introduce Angular2 & render & firebase flowIntroduce Angular2 & render & firebase flow
Introduce Angular2 & render & firebase flow
 
So you think you can scale
So you think you can scaleSo you think you can scale
So you think you can scale
 
Embracing OSS in the enterprise
Embracing OSS in the enterpriseEmbracing OSS in the enterprise
Embracing OSS in the enterprise
 
Html5
Html5Html5
Html5
 
Back to the future with static site generators
Back to the future with static site generatorsBack to the future with static site generators
Back to the future with static site generators
 
Bridging the gap between UX and development - A Storybook by Marko Letic at F...
Bridging the gap between UX and development - A Storybook by Marko Letic at F...Bridging the gap between UX and development - A Storybook by Marko Letic at F...
Bridging the gap between UX and development - A Storybook by Marko Letic at F...
 
Javascript Frameworks Comparison
Javascript Frameworks ComparisonJavascript Frameworks Comparison
Javascript Frameworks Comparison
 
Angle Forward with TypeScript
Angle Forward with TypeScriptAngle Forward with TypeScript
Angle Forward with TypeScript
 
Node.js Ignite Talk
Node.js Ignite TalkNode.js Ignite Talk
Node.js Ignite Talk
 
MEAN Stack Warm-up
MEAN Stack Warm-upMEAN Stack Warm-up
MEAN Stack Warm-up
 
Frameworks for Web Development
Frameworks for Web DevelopmentFrameworks for Web Development
Frameworks for Web Development
 

Similar to Components vs Frameworks

Similar to Components vs Frameworks (20)

jQuery: The World's Most Popular JavaScript Library Comes to XPages
jQuery: The World's Most Popular JavaScript Library Comes to XPagesjQuery: The World's Most Popular JavaScript Library Comes to XPages
jQuery: The World's Most Popular JavaScript Library Comes to XPages
 
Getting started with Vue.js - CodeMash 2020
Getting started with Vue.js - CodeMash 2020Getting started with Vue.js - CodeMash 2020
Getting started with Vue.js - CodeMash 2020
 
What is cool with Domino V10, Proton and Node.JS, and why would I use it in ...
What is cool with Domino V10, Proton and Node.JS, and why would I use it in ...What is cool with Domino V10, Proton and Node.JS, and why would I use it in ...
What is cool with Domino V10, Proton and Node.JS, and why would I use it in ...
 
Node.js
Node.jsNode.js
Node.js
 
Wessel Loth - Fire your Frontend Framework with Lit - TEQnation 2022.pdf
Wessel Loth - Fire your Frontend Framework with Lit - TEQnation 2022.pdfWessel Loth - Fire your Frontend Framework with Lit - TEQnation 2022.pdf
Wessel Loth - Fire your Frontend Framework with Lit - TEQnation 2022.pdf
 
How we build project for Open Source
How we build project for Open SourceHow we build project for Open Source
How we build project for Open Source
 
Devconf 2011 - PHP - How Yii framework is developed
Devconf 2011 - PHP - How Yii framework is developedDevconf 2011 - PHP - How Yii framework is developed
Devconf 2011 - PHP - How Yii framework is developed
 
Reusability is the goal
Reusability is the goalReusability is the goal
Reusability is the goal
 
Portable infrastructure with puppet
Portable infrastructure with puppetPortable infrastructure with puppet
Portable infrastructure with puppet
 
From MEAN to the MERN Stack
From MEAN to the MERN StackFrom MEAN to the MERN Stack
From MEAN to the MERN Stack
 
360|Flex Recap - San Jose 2010
360|Flex Recap - San Jose 2010360|Flex Recap - San Jose 2010
360|Flex Recap - San Jose 2010
 
Sitecore development approach evolution – destination helix
Sitecore development approach evolution – destination helixSitecore development approach evolution – destination helix
Sitecore development approach evolution – destination helix
 
DSL, Page Object и WebDriver – путь к надежным функциональным тестам
DSL, Page Object и WebDriver – путь к надежным функциональным тестамDSL, Page Object и WebDriver – путь к надежным функциональным тестам
DSL, Page Object и WebDriver – путь к надежным функциональным тестам
 
React. Flux. Redux. by Andrey Kolodnitskiy
React. Flux. Redux. by Andrey KolodnitskiyReact. Flux. Redux. by Andrey Kolodnitskiy
React. Flux. Redux. by Andrey Kolodnitskiy
 
Prototyping like it is 2022
Prototyping like it is 2022 Prototyping like it is 2022
Prototyping like it is 2022
 
Greenfield Java 2013
Greenfield Java 2013Greenfield Java 2013
Greenfield Java 2013
 
DSL, Page Object and WebDriver – the path to reliable functional tests.pptx
DSL, Page Object and WebDriver – the path to reliable functional tests.pptxDSL, Page Object and WebDriver – the path to reliable functional tests.pptx
DSL, Page Object and WebDriver – the path to reliable functional tests.pptx
 
SharePoint Saturday Vienna Slides
SharePoint Saturday Vienna Slides SharePoint Saturday Vienna Slides
SharePoint Saturday Vienna Slides
 
#spsclt18 vincent biret #spfx #devops
#spsclt18 vincent biret #spfx #devops#spsclt18 vincent biret #spfx #devops
#spsclt18 vincent biret #spfx #devops
 
Convert your Full Trust Solutions to the SharePoint Framework (SPFx)
Convert your Full Trust Solutions to the SharePoint Framework (SPFx)Convert your Full Trust Solutions to the SharePoint Framework (SPFx)
Convert your Full Trust Solutions to the SharePoint Framework (SPFx)
 

More from Timothy Oxley (6)

Modular vs Monolith
Modular vs MonolithModular vs Monolith
Modular vs Monolith
 
Bundling Client Side Assets
Bundling Client Side AssetsBundling Client Side Assets
Bundling Client Side Assets
 
component: ruby gems for the browser
component: ruby gems for the browsercomponent: ruby gems for the browser
component: ruby gems for the browser
 
Benefits of Clientside templating for Red Dot Ruby
Benefits of Clientside templating for Red Dot RubyBenefits of Clientside templating for Red Dot Ruby
Benefits of Clientside templating for Red Dot Ruby
 
Intro to testing Javascript with jasmine
Intro to testing Javascript with jasmineIntro to testing Javascript with jasmine
Intro to testing Javascript with jasmine
 
Testable client side_mvc_apps_in_javascript
Testable client side_mvc_apps_in_javascriptTestable client side_mvc_apps_in_javascript
Testable client side_mvc_apps_in_javascript
 

Recently uploaded

Artificial Intelligence: Facts and Myths
Artificial Intelligence: Facts and MythsArtificial Intelligence: Facts and Myths
Artificial Intelligence: Facts and Myths
Joaquim Jorge
 
Histor y of HAM Radio presentation slide
Histor y of HAM Radio presentation slideHistor y of HAM Radio presentation slide
Histor y of HAM Radio presentation slide
vu2urc
 

Recently uploaded (20)

TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data DiscoveryTrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
 
Boost PC performance: How more available memory can improve productivity
Boost PC performance: How more available memory can improve productivityBoost PC performance: How more available memory can improve productivity
Boost PC performance: How more available memory can improve productivity
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected Worker
 
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
 
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
Workshop - Best of Both Worlds_ Combine  KG and Vector search for  enhanced R...Workshop - Best of Both Worlds_ Combine  KG and Vector search for  enhanced R...
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
 
Scaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organizationScaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organization
 
Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024
 
Artificial Intelligence: Facts and Myths
Artificial Intelligence: Facts and MythsArtificial Intelligence: Facts and Myths
Artificial Intelligence: Facts and Myths
 
Exploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone ProcessorsExploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone Processors
 
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
 
2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...
 
Histor y of HAM Radio presentation slide
Histor y of HAM Radio presentation slideHistor y of HAM Radio presentation slide
Histor y of HAM Radio presentation slide
 
Boost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdfBoost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdf
 
What Are The Drone Anti-jamming Systems Technology?
What Are The Drone Anti-jamming Systems Technology?What Are The Drone Anti-jamming Systems Technology?
What Are The Drone Anti-jamming Systems Technology?
 
Advantages of Hiring UIUX Design Service Providers for Your Business
Advantages of Hiring UIUX Design Service Providers for Your BusinessAdvantages of Hiring UIUX Design Service Providers for Your Business
Advantages of Hiring UIUX Design Service Providers for Your Business
 
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
 
Real Time Object Detection Using Open CV
Real Time Object Detection Using Open CVReal Time Object Detection Using Open CV
Real Time Object Detection Using Open CV
 
Partners Life - Insurer Innovation Award 2024
Partners Life - Insurer Innovation Award 2024Partners Life - Insurer Innovation Award 2024
Partners Life - Insurer Innovation Award 2024
 
Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024
 
Driving Behavioral Change for Information Management through Data-Driven Gree...
Driving Behavioral Change for Information Management through Data-Driven Gree...Driving Behavioral Change for Information Management through Data-Driven Gree...
Driving Behavioral Change for Information Management through Data-Driven Gree...
 

Components vs Frameworks

Editor's Notes

  1. Could you live it. How dependent are you on jQuery’s abstraction of the DOM? Learning about raw browser methods and differences between them, which is diminishing, is reusable knowledge, for the mid term. knowledge about jQuery has only limited use and lifespan. jquery is just an abstraction, an extra layer that will disappear someday. components is an investment in the future.
  2. Same thing, and there’s no competition, it’s not going to get better.
  3. Technology Stacks
  4. jQuery vs. MooTools vs. YUI Backbone vs. Ember vs. ??? Minimal Sharing
  5. Wasted investment Unlike the serverside…
  6. Embedded, Televisions, etc IE handling when just dealing with TV or XBox
  7. how many times have you rebuilt an app
  8. less guidance less direction
  9. compare moving away from components vs moving away from ember
  10. modular design shared code
  11. More sharing
  12. Investing too much doesn’t make sense
  13. Imagine if all software was built like this Imagine if photoshop was built up out of a bunch of open source pieces So you could build a new better photoshop or improve the existing one