HTTP vs HTTP/2 vs HTTP/3 (QUIC)

HTTP vs HTTP/2 vs HTTP/3 (QUIC)

Nginx

HTTP/1.1

HTTP/2

HTTP/3 (QUIC)

HTTPS

计算机网络协议

1. OSI 协议簇 (7)
2. TCP/IP 协议簇 (4)

refs

https://http3-explained.haxx.se/en/h3/h3-h2

https://http3-explained.haxx.se/zh

https://blog.cloudflare.com/http-3-vs-http-2/

https://blog.cloudflare.com/http3-the-past-present-and-future/

https://www.toptal.com/web/performance-working-with-http-3

https://www.digitalocean.com/community/tutorials/http-1-1-vs-http-2-what-s-the-difference

https://www.nginx.com/blog/introducing-technology-preview-nginx-support-for-quic-http-3/

https://jirak.net/wp/introducing-a-technology-preview-of-nginx-support-for-quic-and-http-3/

https://labs.tadigital.com/index.php/2019/11/28/http-2-vs-http-3/

SVG image placeholder

CSS loading animation

@charset "UTf-8";

/* css-loading.css */

:root {
  --color: #000;
  --default-color: green;
  --new-color: #0f0;
}

body {
  background: #121212
}

#loader {
  width: 500px;
  position: absolute;
  text-align: center;
  left: calc(50% - 250px);
  top: calc(50% - 10px)
}

#loader .square {
  display: inline-block;
  height: 10px;
  width: 10px;
  margin: 10px;
  position: relative;
  box-shadow: 0 0 20px rgba(0,0,0,.3);
  animation: bouncer cubic-bezier(.455,.03,.515,.955) .75s infinite alternate
}

#loader .square:nth-child(5n+1) {
  background: #0F9;
  animation-delay: 0
}

#loader .square:nth-child(5n+2) {
  background: #0CF;
  animation-delay: calc(0s + (.1s * 1))
}

#loader .square:nth-child(5n+3) {
  background: #93F;
  animation-delay: calc(0s + (.1s * 2))
}

#loader .square:nth-child(5n+4) {
  background: #F66;
  animation-delay: calc(0s + (.1s * 3))
}

#loader .square:nth-child(5n+5) {
  background: #FFF35C;
  animation-delay: calc(0s + (.1s * 4))
}

@keyframes bouncer {
  to {
      transform: scale(1.75) translateY(-20px)
  }
}

See the Pen <a href='https://codepen.io/xgqfrms/pen/gOPQbmj'>css loading animation</a> by xgqfrms (<a href='https://codepen.io/xgqfrms'>@xgqfrms</a>) on <a href='https://codepen.io'>CodePen</a>.

---

---

©xgqfrms 2012-2020

www.cnblogs.com 发布文章使用：只允许注册用户才可以访问！

---