State of
Web Development 2020

Vyacheslav Koldovskyy
programmingmentor.com.ua
t.me/programmingmentor

A little about myself...

https://github.com/kamranahmedse/developer-roadmap/blob/master/img/frontend.png?year-2020-2

https://stateofjs.com/

FRONT END

First Website ever

http://info.cern.ch/hypertext/WWW/TheProject.html

Text

1995

1996

http://www.dolekemp96.org/main.htm

 1998

http://youvegotmail.warnerbros.com/

http://youvegotmail.warnerbros.com/cmp/0frameset.html

1999 - Web 2.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

Semantic Web (1999), Web 3.0

Sematic Web Markup

2002 - RIA

var xmlHttp;
// use the ActiveX control for IE5.x and IE6
try {
    xmlHttp = new ActiveXObject("MSXML2.XMLHTTP");
} catch (othermicrosoft){
    try { 
        xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
    } 
    catch (native) {
        // If IE7, Mozilla, Safari, etc: Use native object
        xmlHttp = new XMLHttpRequest();
    } 
}

2006

Usage of JavaScript libraries for websites in Feb 2019

Source: https://w3techs.com/technologies/overview/javascript_library/all

jQuery usage trend 2018-2019

Source: https://w3techs.com/technologies/details/js-jquery/all/all

2010

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

2014

2020

github.com/kamranahmedse/developer-roadmap

THE CASE...

PAGESPEED RESULT =)

BACK END

github.com/kamranahmedse/developer-roadmap

DEVOPS

Server Room

Colocation
(expectations)

Colocation
(reality)

DataCenter

Google Cloud

Google Network

Google Data Centers

Google Edge PoPs

Google Edge Nodes

github.com/kamranahmedse/developer-roadmap

STATE OF JS

http://brendaneich.github.io/ModernWeb.tw-2015/#74

"...when you write JavaScript code,

you do it without respect"

-Vito Andolini Corleone

The problem is...

LISP dialiects

eval function

https://www.csie.ntu.edu.tw/~course/10420/Resources/lp/node93.html

Scheme to JavaScript

http://crockford.com/javascript/little.html

https://www.slideshare.net/RednaxelaFX/implement-js-krystalmok20131110

https://www.slideshare.net/RednaxelaFX/implement-js-krystalmok20131110

stateofjs.com

Satisfaction vs Usage

 

JavaScript Flavors

Front End Frameworks

Data Layer

Back End Frameworks

BACK TO THE FUTURE...

2018

News from GitHub team.....

RULE OF LEAST POWER

JAMstack

JAMstack

GraphQL

Best Practices

  • Entire Project on a CDN
  • Everything Lives in Git
  • Automated Builds
  • Atomic Deploys 
  • Instant Cache Invalidation
  • Custom Elements
  • Shadow DOM
  • HTML Template
  • ES Modules

WEBCOMPONENTS

MODERN CSS POWER

  • CSS GRID LAYOUT
  • CSS VARIABLES
  • VARIABLE FONTS
  • @supports rule

Serverless

Sample Serverless Architecture

HTTP Evolution

WEBASSEMBLY

Vyacheslav Koldovskyy
programmingmentor.com.ua
t.me/programmingmentor

THANK YOU!

State of Web Development 2020

By Programming Mentor (Vyacheslav Koldovskyy)

Made with Slides.com

State of Web Development 2020

  • 570

More from Programming Mentor (Vyacheslav Koldovskyy)