Chico JS - Q4 Challenges

650 views

Published on

This presentation has been given to the MercadoLibre UX area to update the team the project state. It speaks about the most important challenges in the Q4.

0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
650
On SlideShare
0
From Embeds
0
Number of Embeds
56
Actions
Shares
0
Downloads
2
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Chico JS - Q4 Challenges

  1. 1. Chico JS @chicoui
  2. 2. Chico JS @chicoui @hmammana
  3. 3. Chico JS @chicoui @hmammana @lean8086
  4. 4. Chico JS @chicoui@pazguille @hmammana @lean8086
  5. 5. ChallengesReduce the inheritance levels & migrate to prototypeUnify Chico UI & Chico Mobile
  6. 6. Reduce & Migratereduce inheritance levels & migrate to prototype
  7. 7. Animal KingdomAquatic Terrestrial Flyers
  8. 8. Animal KingdomMammals Fishes Birds
  9. 9. Animal KingdomMammals ( female feed breedings )
  10. 10. Animal Kingdom Mammals ( female feed breedings )Quadruped ( female feed breedings, 4 legs )
  11. 11. Animal Kingdom Mammals ( female feed breedings )Quadruped ( female feed breedings, 4 legs ) Cat Dog
  12. 12. Animal Kingdom Mammals ( female feed breedings ) Quadruped ( female feed breedings, 4 legs ) Cat Dogfemale feed breedings female feed breedings
  13. 13. Animal Kingdom Mammals ( female feed breedings ) Quadruped ( female feed breedings, 4 legs ) Cat Dogfemale feed breedings female feed breedings 4 legs 4 legs
  14. 14. Animal Kingdom Mammals ( female feed breedings ) Quadruped ( female feed breedings, 4 legs ) Cat Dogfemale feed breedings female feed breedings 4 legs 4 legs meows barks
  15. 15. But, where is Chico here?
  16. 16. Class inheritance Mammals ( female feed breedings ) Quadruped ( female feed breedings, 4 legs ) Cat Dogfemale feed breedings female feed breedings 4 legs 4 legs meows barks
  17. 17. Before the inheritances changes
  18. 18. Aquatic - Fish
  19. 19. Aquatic - Mammal
  20. 20. Flyer - Mammal
  21. 21. Flyer - Bird
  22. 22. Animal KingdomAquatic Flyers
  23. 23. • open• close• is positioned
  24. 24. After the inheritances changes
  25. 25. After the inheritances changes
  26. 26. ChallengesReduce the inheritance levels & migrate to prototypeUnify Chico UI & Chico Mobile
  27. 27. Migrate to prototypefast, less memory use and it is a standard
  28. 28. On the execution
  29. 29. On the execution
  30. 30. On the execution
  31. 31. On the execution
  32. 32. On the execution
  33. 33. On the execution
  34. 34. On the execution
  35. 35. On the execution many executions by instance
  36. 36. The prototype propertyProperty that is an empty object at the startStored once in memoryProperties and methods are inherited by each instance
  37. 37. On the execution only once execution by instance
  38. 38. ChallengesReduce the inheritance levels & migrate to prototypeUnify Chico UI & Chico Mobile
  39. 39. Unify Chico UI & Chico Mobile two repositories same components
  40. 40. Unify Chico UI & Chico Mobile two repositories same components
  41. 41. Code by repository
  42. 42. Code by repository
  43. 43. Code by repository
  44. 44. Bonus TrackWe also did it:( only in the last 6 months :P ) New Features Improvements Wizard Unified Repository Content Closable, Expandable, Viewport, debug, helpers, Look & Feel Implementation util, Collapsible, Menu, Widget, events, preload, Spinner Content, Positioner, cache, factory, support Datagrid Control Modal & Lite Modal Form Validation Default Messages Big Inputs Close - WAI-ARIA Versioned Assets Positioner Icons Viewport New Boxes Carousel Message Boxes Only one sprite for fallback! Chico via CDN Deprecated Styles Deleted Tests Documentation & Template
  45. 45. Bonus TrackWe also read it:( only in the last 2 months, :O too nerdy ) Pointer Events Draft DOM Browser Support New CSS3 relative font size: rem Measuring Performance On Mobile With Chrome A Strategy for i18n and Node.js DevTools + Remote Debugging Revisiting JavaScript Objects Firefox OS Simulator 1.0 is here! SHADOW DOM 101 Decouple Your CSS From HTML With Reusable How we Learned to Stop Worrying and Love Modules JavaScript Sub-Pixel Problems in CSS Design, Viewport & Content How to Detect DOM Changes in CSS Testing @font-face Support on Mobile and Tablet Native CSS feature detection via the @supports Conditional loading of resources with mediaqueries rule Why you should say HTML classes, CSS class Conditional comments (Windows) selectors, or CSS pseudo-classes, but not CSS JavaScript APIs you’ve never heard of (and some classes you have) Links for Advanced JavaScript Reading CSS Grid Layout Draft
  46. 46. Bonus TrackWe also speak about it:( during the year ) Chico UI at JSConfAR FrontEnd good practices at BA & San Luis HTML for developers at BA & San Luis Outline the content at BA The prototype property at BA CSS good practices at BA JavaScript module pattern at BA
  47. 47. Thanks @chicoui - chico@mercadolibre.comhttps://github.com/mercadolibre/chico/issues/new

×