1 / 56

Future of Front-End Development

Explore the evolution of front-end development, from Web 2.0 to the Semantic Web to modern frameworks like Vue.js and React. Learn about the landscape, frameworks, and trends shaping the industry today. Discover the impact of Single Page Applications, Progressive Web Apps, and Server-Side Rendering. Delve into browser-side and server-side optimizations, and consider the future of front-end architecture in the age of Web Components and serverless solutions.

estella
Download Presentation

Future of Front-End Development

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Futureof Front-EndDevelopment by Vyacheslav Koldovskyy, SoftServe, Learning Solutions Architect, Professional Google Cloud Architect, t.me/programmingmentor

  2. FRONT-END LANDSCAPE

  3. FRAMEWORKS2019

  4. WHAT'S WRONG WITH SPA?

  5. ALL IS WRONG!

  6. IN DETAIL… Is it OK to be "Single Page"? Is it OK to be "Application"?

  7. HOW DO WE FIGHT CONSEQUENCES Browser-side: History API Minification, Uglification Code Splitting Progressive Enhancement PWA AMP Caching Accessibility Optimizations Server-side: Server-Side Rendering Isomorphic Applications Complex Architecture

  8. MAYBE THERE IS ANOTHER WAY?

  9. LONG TIME AGO…

  10. HOW IT ALL HAS STARTED?

  11. 1991

  12. 1991

  13. 1995

  14. 1996

  15. 1999 - Web 2.0 https://en.wikiversity.org/wiki/Web_2.0

  16. Semantic Web (1999), Web 3.0 "I have a dream for the Web [in which computers] become capable of analyzing all the data on the Web – the content, links, and transactions between people and computers. A "Semantic Web", which makes this possible, has yet to emerge, but when it does, the day-to-day mechanisms of trade, bureaucracy and our daily lives will be handled by machines talking to machines. The "intelligent agents" people have touted for ages will finally materialize." - Tim Berners Lee, 1999 https://en.wikipedia.org/wiki/Semantic_Web

  17. Sematic Web Markup https://en.wikipedia.org/wiki/Semantic_Web#cite_note-6

  18. 2002 - RIA

  19. 2008 – HTML5 Application January 2008 – Working Draft October 2014 – W3C Recommendation Key points: Multiple new APIs Media support RIA becomes obsolete SPA boom has started

  20. APPROACHMATTERS

  21. THE GREAT DIVIDE “TWO FRONT-END DEVELOPERS ARE SITTING AT A BAR. THEY HAVE NOTHING TO TALK ABOUT.” — CHRIS COYIER, JANUARY 2019 https://css-tricks.com/the-great-divide

  22. WHO IS FRONT-END DEVELOPER? Let’s vote  https://css-tricks.com/the-great-divide

  23. THE CASE…

  24. PAGESPEED RESULT 

  25. BACK TO THE ROOTS…

  26. 2018 – NEWS FROM GITHUB TEAM

  27. RULE OF LEAST POWER

  28. GATSBY.JS

  29. Google Cloud Global Cache

  30. SOME POSSIBLE SERVERLESS ARCHITECTURE

  31. WEBCOMPONENTS Custom Elements Shadow DOM HTML Template ES Modules

  32. SPEED MATTERS https://developers.google.com/web/updates/2019/02/hotpath-with-wasm

  33. MODERN CSS POWER CSS GRID LAYOUT CSS VARIABLES VARIABLE FONTS @supports rule

More Related