跳到正文
网页珍奇柜Web Curio

16×16 圆点代码高尔夫

tixy.land,Martin Kleppe (aemkei),2020 年

正在布展…

本柜的现场复刻:按原作的技术思路从零编写,不含原作的代码和素材。原作请点上方「去看原作」。

它是怎么做的

  1. 第 1 步用户输入被包进 new Function('t','i','x','y', ...)。
  2. 第 2 步每帧对 256 个格子求值,返回值截断到 [-1,1]。
  3. 第 3 步正值画白点、负值画红点,半径与绝对值成正比。
  4. 第 4 步表达式写入 URL,方便分享。

复刻配方

一段技术配方,可以直接交给 AI 编程助手,也可以自己照着写。想指定技术栈、位置和性能预算,就把它加入实现方案。

Create a 16x16 grid of circles on a canvas. Compile the user's one-line expression with the Function constructor taking t, i, x, y and wrap the call in try/catch. Each frame, evaluate it per cell with elapsed seconds, clamp the result to [-1, 1], and draw a circle whose radius is the absolute value times half the cell size, colored by sign. Persist the expression in the URL query so every sketch is a shareable link.

档案

能不能拿来用

原作以 ISC (declared in package.json; no LICENSE file) 许可开源:可以阅读源码学习,按许可证条款使用;在自己的项目里引用时保留原作者署名。

性能开销

视觉强度

实现难度

尺度为策展判断(1 到 5),用于比较和推荐。

核实记录:Live site loads (HTTP 200, title '(t,i,x,y) => "creative code golfing"'); repo via gh api (no SPDX licence) and package.json shows "license": "ISC".