Saturday, July 29, 2023

Lit & web components

name "Lit" stands for "little" library

 This is going to be Lit 🔥 with Justin Fagnani (JS Party #284) |> Changelog

Lit, a library that helps you build web components. With 17% of pageviews in Chrome registering use of web components, Lit has gained widespread adoption


WebGL != three.js

WebGL is a custom language used for graphics card programming;

WebGL - Wikipedia
WebGL (Short for Web Graphics Library) is a JavaScript API for rendering interactive 2D and 3D graphics within any compatible web browser without the use of plug-ins.

three.js library make this more developer friendly from JavaScript; far from "easy"

Hello vertex attributes - Web APIs | MDN

<script type="x-shader/x-vertex" id="vertex-shader">
  #version 100
  precision highp float;

  attribute float position;

  void main() {
    gl_Position = vec4(position, 0.0, 0.0, 1.0);
    gl_PointSize = 64.0;
<script type="x-shader/x-fragment" id="fragment-shader">
  #version 100
  precision mediump float;
  void main() {
    gl_FragColor = vec4(0.18, 0.54, 0.34, 1.0);
 Draw With WebGL Flowers