ATProto Browser

ATProto Browser

Experimental browser for the Atmosphere

Post

Svelte's fine-grained reactivity doing its thing <3

May 3, 2025, 8:48 AM

Record data

{
  "uri": "at://did:plc:gdgssnismf7rsf5you3ndgmm/app.bsky.feed.post/3loaxdnopwk2o",
  "cid": "bafyreifh6h7e4oox6x3gdsuhpvxcziy5473or2tmlls45glmbpu3sg34c4",
  "value": {
    "text": "Svelte's fine-grained reactivity doing its thing <3",
    "$type": "app.bsky.feed.post",
    "embed": {
      "alt": "A rotating cube. This is the code:\n\n<script lang=\"ts\">\n\tlet canvas: HTMLCanvasElement = $state(null!);\n\tlet rotation = $state(0);\n</script>\n\n<canvas bind:this={canvas}></canvas>\n\n{#await initializeWebGPU(canvas) then state}\n\t<World plugins={[WebGPU(state), Systems]}>\n\t\t<Entity>\n\t\t\t<Trait trait={Mesh()} />\n\t\t\t<Trait trait={Geometry(new CubeGeometry({ size: 1 }))} />\n\t\t\t<Trait\n\t\t\t\ttrait={Transform()}\n\t\t\t\trotation.x={rotation}\n\t\t\t\trotation.y={rotation}\n\t\t\t\tposition.z={-5}\n\t\t\t/>\n\t\t</Entity>\n\n\t\t<System\n\t\t\tcallback={(dt) => {\n\t\t\t\trotation += dt;\n\t\t\t}}\n\t\t/>\n\t</World>\n{/await}\n",
      "$type": "app.bsky.embed.video",
      "video": {
        "$type": "blob",
        "ref": {
          "$link": "bafkreicxyyt2rdcf3tdcv4jsbrcozkxa7bh24raqdjdejhlb67zuukq6kq"
        },
        "mimeType": "video/mp4",
        "size": 235952
      },
      "aspectRatio": {
        "width": 4096,
        "height": 1714
      }
    },
    "langs": [
      "en"
    ],
    "createdAt": "2025-05-03T08:48:04.443Z"
  }
}