How HTTP/2 Works, Performance, Pros & Cons and More

Подписаться 413 тыс.

Просмотров 103 тыс.

50% 1

HTTP/2 or H2 for short is a major revision of the hyper text transfer protocol that improves the performance of the web. It uses a binary protocol and multiplexing.
HTTP/2 (Slides)
payhip.com/b/E37AG
(Members get all slides for free. Become a Member to support the channel)
/ @hnasr
Time codes
0:00 Intro
2:15 HTTP 1.1
5:50 HTTP/2
8/25 HTTP/2 With Push
9:48 HTTP/2 Pros
14:10 HTTP/2 Cons
17:15 Demo
In this video I want to go through how HTTP/2 works, its pros and cons and show the performance difference between HTTP 1.1 and HTTP/2
Http/1
request has to wait for a response
And if you used up your connection response you can send anything else.
Source Code: github.com/hnasr/javascript_p...
So hack !
6 tcp connections
Pros
One connection
Multipex
Push ( have to enable)
Hpack (compress)
Cons
Abuse push
Proxies that dont support it might slow down
Load balancer layer 7 (a layer 7 load balancer that doesnt support h2 will slow down when your web server supports it)
+----------+--------+---------+---------+
| Protocol | Online | Fast 3G | Slow 3G |
+----------+--------+---------+---------+
| HTTP 1.1 | 94 ms | 10 s | 36 s |
+----------+--------+---------+---------+
| HTTP/2 | 171 ms | 2.7 s | 10 s |
+----------+--------+---------+---------+
Fundamentals of Networking for Effective Backends udemy course (link redirects to udemy with coupon)
network.husseinnasser.com
Fundamentals of Database Engineering udemy course (link redirects to udemy with coupon)
database.husseinnasser.com
Introduction to NGINX (link redirects to udemy with coupon)
nginx.husseinnasser.com
Python on the Backend (link redirects to udemy with coupon)
python.husseinnasser.com
Become a Member on RU-vid
/ @hnasr
Arabic Software Engineering Channel
/ @husseinnasser
🔥 Members Only Content
• Members-only videos
🏭 Software Architecture Videos
• Software Architecture
💾 Database Engineering Videos
• Database Engineering
🛰 Network Engineering Videos
• Network Engineering
🏰 Load Balancing and Proxies Videos
• Proxies
🐘 Postgres Videos
• PostgresSQL
🧮 Programming Pattern Videos
• Programming Patterns
🛡 Web Security Videos
• Web Security
🦠 HTTP Videos
• HTTP
🐍 Python Videos
• Python by Example
🔆 Javascript Videos
• Javascript by Example
Support me on PayPal
bit.ly/33ENps4
Become a Patreon
/ hnasr
Stay Awesome,
Hussein

Наука

Опубликовано:

4 июл 2024

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист

Посмотреть позже

Комментарии : 126

@hnasr 2 года назад

Get my Fundamentals of Networking for Effective Backends udemy course Head to network.husseinnasser.com for a discount coupon (link redirects to udemy with coupon applied)

@allisonmachado 3 года назад

Netflix for developers :)

@hnasr 3 года назад

❤️

@ScarzChosenspokesmen 3 года назад

LOL great comment

@nadertarek4822 2 года назад

HAHA! literally

@andile5945 2 года назад

And you don’t have to use someone else’s account

@nateengedal7939 Год назад

hard pass on the chill

@whereismypipey 4 года назад

I loved the picture grid loading example to nicely visualize the performance and difference in number of connections.

@umeshshetty0605 Год назад

I am a Network Engineer but I love the backend Engineering stuff that you show and it makes it easier for me to understand application problems while troubleshooting the network side of it. Thank You and Keep posting !!!

@hnasr Год назад

Thanks!! Glad to see more network engineers in the channel. Cheers

@dean6046 4 года назад

thank you Hussein! I want you to understand that this is great content and I love the way you deliver it with such energy and excitement. I frequently download videos from RU-vid for offline use and I just downloaded this one because I think it's great content.

@balramverma4873 2 года назад

This channel is to addictive that even in the period I’m focusing on front end stuff i end up watching these.

@omriterem6448 4 года назад

One of the best RU-vid channels for programmers...

@mohamad5497 3 года назад

Your content is great! Thanks Hussein!

@Esmi_here 7 месяцев назад

It was so fun watching!!

@SatishKumar-jb9qm 3 года назад

Your content is great! Thank you for posting.

@amsterdenko9854 2 года назад

First time on your channel. Subscribed after this first video. I like your style of content delivery. Such a themes become much more entertantaining. Thank You!

@SateeshBandi 4 года назад

Very good demo.. I loved it.

@mageshp5998 4 года назад

Liked your demo!!

@smohammadhn 2 года назад

Fantastic explanation, loved it

@ankitsah2819 4 года назад

Awesome explanation 👍🏻

@kaleemullah247 Год назад

Loved the demo.

@user-fm7kj3li2w 4 года назад

excellent!! very clear provocation and easy to understand.

@hnasr 4 года назад

Thank you 🙏

@romantsyupryk3009 4 года назад

Thanks so much for this video tutorial.

@natarajboina7525 3 года назад

This was very insightful. Thanks for this video.

@hnasr 3 года назад

Thanks for your comment Nataraj

@TimothyNyota 2 года назад

Subscribed!! Great content, man!!

@subhamthemusicalguy8851 4 года назад

Joined your channel to support you. Excellent work

@hnasr 4 года назад

❤️ thanks Subham ! Appreciate your support

@GauravJain108 2 года назад

Thanks, Hussein! :)

@andikakurniawan4188 2 года назад

I like this guy. This guy is smart and also have talent to be teacher...

@Lucasmont001 4 года назад

excellent video! Thanks! ;)

@oah8465 3 года назад

More reasons to love. L4 LBs. Thx Hussein.

@shubhampawar2207 4 года назад

Awesome Presentation!...

@hnasr 4 года назад

😊🙏 thanks

@AnilSharma-gr6ck 2 года назад

very good , thanks

@romantsyupryk3009 4 года назад

Amazing demo HTTP/1.1 and HTTP/2.0 Thanks you very very very much.

@hnasr 4 года назад

thanks Roman for all the love and comments!!!

@romantsyupryk3009 4 года назад

@@hnasr 😃😉

@AwesomeMetalBands 3 года назад

Seriously great content very very interesting!!@

@hozay6552 2 года назад

So many advances for the internet that I was not aware of!

@longtranbao4177 2 года назад

Thanks you! In school people don't teach about this stuff.

@rahulmalu6741 4 года назад

Hi @husseon Nassar: In the demo for http2, did you used the server push mechanism to push the 100 images or only the protocol was set to http2 (without enabling the server push)?

@fraollemecha 2 года назад

HTTP/2: We gotta do it fast. Michael Scott: That's what she said.

@bharat639 4 года назад

I have watched a lot of your videos. Thank you very much for sharing your knowledge.

@amrudeshs 4 года назад

Hei. Great info. Thnx. Can you also make a comparison between HTTP2 server push and Websockets based push messages? I understand that they dont serve the same purposes but a short video on it explaining when to use what would be great.

@maheshkariya 3 года назад

Thanks 🙏

@danielkrajnik3817 3 года назад

the more I learn about software, the more I find that every next upgrade boils down to parallelization

@akashdeepbilkhu8076 Год назад

Amazing

@treepiesinc1418 4 года назад

good. thanks.

@shah5364 Год назад

thanks

@zitro7052 3 года назад

Im in education as IT-Specialist - System Integration right now, third year and almost finished my Project. My Teachers couldnt teach us normal OSI model or SQL, we never had HTML in school. imagine you doin this just in your free time and you are more meaningfull as much Teachers in germanys working schools for myself and some friends. Thanks for that little snack, i just wanna set up an HTTP 2 server now :D! should i go for nginx or more for something like apache?

@sreevishal2223 4 года назад

michael scott..! , that's what she said.. haha :p :p Nice explanation..!

@Ranjith_P 2 года назад

Its a huge performance difference - thats what she said

@nabidulalam6956 3 года назад

powerful stuff :v

@chenrvn 4 года назад

1. Thanks, Gr8 video 2. It will be helpful if u will show the stream Ids in the http request/response and the TLS connection mechanism 😎

@hnasr 4 года назад

Thanks Chen! That is a great idea diving deep into the belly of the beast of HTTP/2.. will consider it in the future.

@chenrvn 4 года назад

@@hnasr you are the men

@abnan0001 4 года назад

I checked again brother Is there any update for the series

@surendrasharma8238 2 года назад

not much learning. But still good for beginners.

@Twerqt 4 года назад

Hey, that is a brilliant explanation. I have one question. How did you say at 18:40 that there are 6 TCP connections sending images in parallel .. I couldn't make it out from the video

@hnasr 4 года назад

Siddartha Reddy Thanks 🙏 6 connections are opened in case of HTTP/1 In browsers i explain this here Why Browsers have 6 active TCP Connections for each website? ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-Xkr2nm6UPN8.html

@venkateswarans1012 3 года назад

HTTP 2 resolves head of line blocking at application layer but in transport layer (TCP) it's still exist and Quic is trying something to achieve even on transport layer level.

@jerweiyeoh7096 3 года назад

Awww yis, another 1k like Either there is an ongoing meme on the community of leaving the like counts at 999 and I'm screwing it, or I'm on fire! XD PS: Appreciate the explanations, both high level and low level.

@hnasr 3 года назад

🙏🙏🙏

@Tony-dp1rl Год назад

Those CONs of HHTP/2 are certainly a stretch, given a server could return a HTML page with all sorts of unused assets in it anyway which effectively creates a PUSH in terms of network load ... and the chances of having a H1 load balancer and H2 backend are almost zero.

@devashishrana1637 3 года назад

Suppose my configuration is client -> gateway -> server, how will http2 behave in this scenario between each layer?? or should I just keep only client and gateway in http2?

@abdelrhmanahmed1378 2 года назад

does http2 also multiplex the segment inside each request or send them in sync and wait for each segment ack ?!

@orzumirzayev7026 Год назад

Is Hussein right when saying http 1.1 uses separate tcp connection for each request?

@saumyapandey218 2 года назад

What happens when a file is already cached in the client but the server pushes the file because of its configuration?

@PouriyaJamshidi 4 года назад

cURL supports HTTP/3 (experimental) as well.

@hnasr 4 года назад

Nice! Didn't know that, looks like I need to make a video about cURL, thanks !

@PouriyaJamshidi 4 года назад

@@hnasr Thanks to you.

@harshg2003 4 года назад

How can I check if my web server supports Http/1.1 or H/2 or H/3? How can I force H1 and H2 on either client side or server side, if they supports both?

@hnasr 4 года назад

Hey Harash, I recommend chrome dev tools. Good idea ill make a video on this

@raphaelkuttruf 3 года назад

great content :) how would i set up http2 in my backend network after a reverser proxy?

@arongulyas6096 3 года назад

HAproxy supports http/2

@shavishvilitornike 2 года назад

How do I become member of this channel?

@sawza0313 2 месяца назад

🎉👏🏼👏🏼👏🏼👏🏼👏🏼👏🏼

@waagnermann Год назад

when you showed benchmarks where it was written that there was 6 TCP connections? in network panel

@hnasr Год назад

From Google paper Popular Web browsers, including IE8 [2], Fire- fox 3 and Google’s Chrome, open up to six TCP connections per domain, partly to increase parallelism and avoid head-of- line blocking of independent HTTP requests/responses, but mostly to boost start-up performance when downloading a Web page. static.googleusercontent.com/media/research.google.com/en//pubs/archive/36640.pdf

@Shmancy_pants_69 3 года назад

Hey noob question, how did you run that test on the image? that was cool. Please reply :-)

@hnasr 3 года назад

It was a Python script I found online stackoverflow.com/questions/5953373/how-to-split-image-into-multiple-pieces-in-python

@palaniappanrm6277 4 года назад

How to host a server in local with HTTP/2 support? Does node http-server, apache tomcat support it?

@hnasr 4 года назад

Palaniappan RM sure all of those support it! Check out this video where I show h2 on caddy because its the easiest Getting started with Caddy the HTTPS Web Server from scratch ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-t4naLFSlBpQ.html

@45xtc 3 года назад

Thank a lot Hussein.one question?for example clent says keep alive and server response not keep alive.what does it happen in tcp connection?client will try to re establish again with 3 way handshake?

@hnasr 3 года назад

If the server doesn’t support keepalive (which I will be surprised if it doesn’t means it is so old its 1997 or prior) the connection will be terminated after the response will be created. In http/2 the connection will be always kept alived

@45xtc 3 года назад

@@hnasr thank you very much for you great content that you offer us!keep going

@ahsannasir6214 3 года назад

10:41 I see what you did there xD

@flobbie87 3 года назад

What, where does it say in the spec that i have to wait for the response to send another request? I hope no actual client does that.

@hhellohhello 4 года назад

Sorry, but whats the difference between keep alive header and multiplexing?

@hnasr 4 года назад

hhellohhello no problem! the Keepalived header instructs the server to not immediately close the TCP connection after it is made so we continue send more data through it. This was available since http 1.1 Multiplexing is the ability to send multiple requests in parallel in that TCP connection. Something we couldn’t in http 1.1 and only available in http2

@hazemabdelalim5432 2 года назад

The idea here , if the server and client keeps this connection open , isn't that some-kind of wasting resources ? if the client doesn't request anything , the server will still need to have maintain this connection even if the user doesn't use it , probably we can set a ttl to the open connection , so after that time with not being active , it will be closed

4 года назад

What is difference HTTP1.1 persistent connection and H2 multiplexing?

@hnasr 4 года назад

Both HTTP 1.1 and H2 have persisted connection. (They are not closed as long as requests are being sent) The difference is in H1.1 you can only send one request at a time and you can’t send another request until you get a response.. this is made slightly better with pipelining where you can send multiple requests in the same connection but the server must respond in order the requests where sent. This causes problems with proxies and bad implementations. So browsers in HTTP 1.1 opens multiple connections to get around this limitations. In H2 you can send any number of requests in the same connections in parallel. The reason is each request is uniquely identified with a streamid. So if we get a response we know what request it belongs to All of this is hidden from us programmers but its good to understand.. Watch my HTTP/2 playlist here to learn more HTTP/2 ru-vid.com/group/PLQnljOFTspQWbBegaU790WhH7gNKcMAl-

@AMFLearning 2 года назад

amflearning by doing

@apoorvamishra5952 3 года назад

how can we check if it's a 6 TCP connections in case of HTTP/1.1 in developers tool?

@hnasr 3 года назад

ConnectionID, I illustrate this here ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-LBgfSwX4GDI.html

@apoorvamishra5952 3 года назад

@@hnasr cool thanks!

@virgilbaldovin1852 2 месяца назад

If someone asks me “what is an API?” i’ll send them this one

@Emmanuel-px9lk 4 года назад

Why does HTTP 1.1 use '6' TCP connections? Is it a technical reason it is 6 or is this just a common standard?

@hnasr 4 года назад

kidsWillSeeGhosts why 6 in particular I think it was anecdotal evidence that more than 6 doesn’t give more performance but more TCP overhead.. If you are asking Why H1 open many connections is to be able to send multiple requests in parallel (can’t do that in a single tcp connection) H2 allowed sending multiple requests in a single tcp connection using streams hope that helps 😊

4 года назад

If a lot of multiple objects are loaded in parallel, each object will just compete for this limited bandwidth, so each object will load proportionally slower. Also clients might be able to open hundreds of connections, but few web servers will want to do that, because they often are processing requests for many other users at the same time. A hundred simultaneous users, each opening 100 connections, will put the burden of 10,000 connections on the server. This can cause significant server slowdown.

@Emmanuel-px9lk 4 года назад

@ Thanks

@abnan0001 4 года назад

Geodatabase related videos have been removed from your channel Could u please reupload then As the videos were helpful for us Thanks

@hnasr 4 года назад

Muhammad Abnan hey Muhammed can you try again? Let me know..

@abnan0001 4 года назад

Hi It’s not there brother Last week I saw but since from afternoon I’m looking those But I cannot find it at all

@abnan0001 4 года назад

Nothing is there about geodatabase series and versioning related

@hnasr 4 года назад

Muhammad Abnan Multi-User Geodatabase ru-vid.com/group/PLQnljOFTspQWseiNSmOMgsR5lgugKg_KP

@sidharthvijayakumar3521 8 месяцев назад

This is not right load balancer layer 7 supports http 2. Recently i have created a flask app which only supports http 1.1 which using gunicorn which also does not support http 2 . Then used Cloudrun which was deployed as a backend to Classic application LB in GCP so my api in local shows as http 1.1 but the same Api in the load balancer i get it as http2 so i do not think what you said is relevant now.