Dos & Donts when making Technology choices

  • Published on
    28-Jan-2018

  • View
    122

  • Download
    2

Embed Size (px)

Transcript

  1. 1. Dos & Donts when making Technology Choices Vinci Rufus @areai51 Sr. Director SapientRazorfish Google Developer Expert
  2. 2. Other than being a GDE I have no other association with Google. Opinions and perspectives shared in this talk are my own and do not reflect that of any other organization. I dont get paid by Google. (which sucks) All references to Googles products or any other companies products are purely Coincidental. Disclaimer
  3. 3. 1996 2002 2003 2005 2007 Evolution of Smartphones
  4. 4. Watch this once every 2 months for a healthy dose of motivation https://www.youtube.com/watch?v=9hUIxyE2Ns8&t=126s
  5. 5. Dos & Donts
  6. 6. Plan for Scale but dont necessarily go overboard building for one
  7. 7. Avoid #geekgasm
  8. 8. Be Paranoid about Speed & Payload
  9. 9. Stay Performant from Day 0 Time for Dev Environment setup Loading time during development Build Time.
  10. 10. Spend time on what is more Important
  11. 11. Architecture Design Principles
  12. 12. Data / Content Layer User Experience Layer De-Couple
  13. 13. RDBMS Aggregation Machine Learning PWA Native Microservices Orchestration Layer API Gateway Be Future Proof Ready Data / Content Middleware User eXperience
  14. 14. RDBMS Aggregation Machine Learning PWA Native Microservices Orchestration Layer API Gateway De-Couple Identity Management Identity Management
  15. 15. True Mobile first Strategy API Gateway / Graph QL Treat everything as just another device Microservices
  16. 16. Single Page Experience over SPA Home & Categories Gallery / Product Listing Product Details Checkout Flow My Account A Collection of smaller modular apps. www.bit.ly/why-spe
  17. 17. Leverage the Cloud Cloud Native features Go Serverless, Cloud Functions QA & staging environments on cloud
  18. 18. Not Every App needs to be Native But every Responsive site needs to be a PWA
  19. 19. Reasons we went Native We want Push Notifications We wanted a good User Experience ( aka smooth scrolling) Want it to work Offline Leverage Device Capabilities.
  20. 20. PWAs can do All that .. atleast on Android
  21. 21. WTH is a Progressive Web App ... a new software development methodology for building modern frontend
  22. 22. What Constitutes a PWA App Shell Model Instant Loading Offline Support 60 fps Add to Home Screen Push Notifications
  23. 23. Minimal Viable PWA App Shell Add to Home Screen Full Screen Offline Support
  24. 24. Full-on PWA Push Notifications Deeply Integrated PWA Background Sync
  25. 25. 3xmore time spent on site 40%higher re-engagement rate 70%greater conversion rate via homeScreen 3xlower data usage Flipkart Lite
  26. 26. ~60 MB on Android ~100 MB on iOS 0.5 MB as a PWA OLA PWA
  27. 27. PWA should replace your Responsive Site
  28. 28. AMP AMP HTML AMP HTML is basically HTML extended with custom AMP properties AMP JS The AMP JS library ensures the fast rendering of AMP HTML pages. AMP Cache The Google AMP Cache can be used to serve cached AMP HTML pages.
  29. 29. PWA + AMP = PWAMP
  30. 30. Tech Team you Hire
  31. 31. Full Stack Developer Angular React JS Preact Vue JS Node Node Java Play Go Lang MongoDB MySQL Neo4J Cassendra Frontend Backend Database
  32. 32. Polyglot Developer Angular React JS Preact Vue JS Node Node Java Play Go Lang MongoDB MySQL Neo4J Cassendra Frontend Backend Database
  33. 33. Full stack to Polyglot Switch Early Stage Full Steam Fullstack Polyglot MVP is Shipped
  34. 34. Vinci Rufus @areai51 Stay Practical.