# SDF

Published articles for SDF.

This is one page of public article previews, not the complete archive. Follow Next page to continue. Summaries are not the original full articles.

## Building an Infinite Liquid Glass Grid with Three.js, WebGPU, and TSL

DevFeed: [Building an Infinite Liquid Glass Grid with Three.js, WebGPU, and TSL](<https://devfeed.tech/articles/building-an-infinite-liquid-glass-grid-with-three-js-webgpu-and-tsl-4345.md>)

Original publisher: [Read original article](<https://tympanus.net/codrops/2026/09/08/building-an-infinite-liquid-glass-grid-with-three-js-webgpu-and-tsl/>)

Author: Filip Kantedal

Published: 2026-09-08T13:09:48Z

Content type: tutorial

Language: en

Sources: [Codrops](<https://devfeed.tech/sources/codrops.md>)

Topics: [webgpu](<https://devfeed.tech/topics/webgpu.md>), [Three.js custom shaders](<https://devfeed.tech/topics/three-js-custom-shaders.md>), [refraction shader](<https://devfeed.tech/topics/refraction-shader.md>), [signed distance functions](<https://devfeed.tech/topics/signed-distance-functions.md>)

Tags: [3d-web-experiences](<https://devfeed.tech/tags/3d-web-experiences.md>), [chromatic-dispersion](<https://devfeed.tech/tags/chromatic-dispersion.md>), [creative-coding](<https://devfeed.tech/tags/creative-coding.md>), [custom-shaders](<https://devfeed.tech/tags/custom-shaders.md>), [glass](<https://devfeed.tech/tags/glass.md>), [glass-shader](<https://devfeed.tech/tags/glass-shader.md>), [glassmorphism](<https://devfeed.tech/tags/glassmorphism.md>), [gpu-rendering](<https://devfeed.tech/tags/gpu-rendering.md>), [infinite](<https://devfeed.tech/tags/infinite.md>), [infinite-carousel](<https://devfeed.tech/tags/infinite-carousel.md>), [infinite-grid](<https://devfeed.tech/tags/infinite-grid.md>), [interactive-3d](<https://devfeed.tech/tags/interactive-3d.md>), [liquid-glass](<https://devfeed.tech/tags/liquid-glass.md>), [next-js](<https://devfeed.tech/tags/next-js.md>), [r3f](<https://devfeed.tech/tags/r3f.md>), [react-three-fiber](<https://devfeed.tech/tags/react-three-fiber.md>), [refraction-shader](<https://devfeed.tech/tags/refraction-shader.md>), [sdf](<https://devfeed.tech/tags/sdf.md>), [shader-effects](<https://devfeed.tech/tags/shader-effects.md>), [signed-distance-functions](<https://devfeed.tech/tags/signed-distance-functions.md>), [three-js](<https://devfeed.tech/tags/three-js.md>), [three-js-shading-language](<https://devfeed.tech/tags/three-js-shading-language.md>), [three-js-webgpu](<https://devfeed.tech/tags/three-js-webgpu.md>), [tsl](<https://devfeed.tech/tags/tsl.md>), [tsl-shaders](<https://devfeed.tech/tags/tsl-shaders.md>), [tutorials](<https://devfeed.tech/tags/tutorials.md>), [video](<https://devfeed.tech/tags/video.md>), [webgl](<https://devfeed.tech/tags/webgl.md>), [webgpu](<https://devfeed.tech/tags/webgpu.md>), [webgpu-shaders](<https://devfeed.tech/tags/webgpu-shaders.md>)

### AI overview

A tutorial on building an infinite liquid-glass grid in the browser with Three.js, WebGPU, TSL, custom shaders, and video textures.

### Source excerpt

An exploration of infinite grids, liquid glass, and video refraction using Three.js, WebGPU, TSL, and custom shaders.

## RFC 9880 and the IoT Validation Problem

DevFeed: [RFC 9880 and the IoT Validation Problem](<https://devfeed.tech/articles/rfc-9880-and-the-iot-validation-problem-18924.md>)

Original publisher: [Read original article](<https://blog.frankel.ch/rfc-9880-iot-validation-compiler/>)

Author: Stefano Fago

Published: 2026-07-26T00:00:00Z

Content type: article

Language: en

Sources: [Nicolas Fränkel](<https://devfeed.tech/sources/nicolas-frankel.md>)

Topics: [Internet of things](<https://devfeed.tech/topics/iot.md>), [SDF](<https://devfeed.tech/topics/sdf.md>), [data](<https://devfeed.tech/topics/data.md>), [JSON](<https://devfeed.tech/topics/json.md>), [Code](<https://devfeed.tech/topics/code.md>), [CoAP](<https://devfeed.tech/topics/coap.md>), [MQTT](<https://devfeed.tech/topics/mqtt.md>), [HTTP](<https://devfeed.tech/topics/http.md>), [TLS (Transport Layer Security)](<https://devfeed.tech/topics/tls.md>)

Tags: [architecture](<https://devfeed.tech/tags/architecture.md>), [code](<https://devfeed.tech/tags/code.md>), [data](<https://devfeed.tech/tags/data.md>), [development](<https://devfeed.tech/tags/development.md>), [iot](<https://devfeed.tech/tags/iot.md>), [json](<https://devfeed.tech/tags/json.md>), [protocol](<https://devfeed.tech/tags/protocol.md>), [sdf](<https://devfeed.tech/tags/sdf.md>), [standards](<https://devfeed.tech/tags/standards.md>), [validation](<https://devfeed.tech/tags/validation.md>)

### AI overview

This article examines RFC 9880 and its Semantic Definition Format (SDF) as an ecosystem-neutral, JSON-based way to describe IoT devices. It argues that SDF validation is best understood as a compilation problem and discusses how different IoT ecosystems represent the same physical concepts incompatibly.

### Source excerpt

The IoT/IIoT world has a data model problem and the concept of Digital Twin has made this issue more important. Plenty of people have tried to fix it. RFC 9880 and its Semantic Definition Format (SDF) are a serious attempt: a JSON-based, ecosystem-neutral way to describe what a device is and what it does. I have had some experiences with this specification, and I've understood that the format shows its full value once you treat it as source code, something you compile.

## Volume Grids in Geometry Nodes

DevFeed: [Volume Grids in Geometry Nodes](<https://devfeed.tech/articles/volume-grids-in-geometry-nodes-19182.md>)

Original publisher: [Read original article](<https://code.blender.org/2025/10/volume-grids-in-geometry-nodes/>)

Author: Hans Goudey

Published: 2025-10-07T20:29:49Z

Content type: release

Language: en

Sources: [Blender](<https://devfeed.tech/sources/blender.md>)

Topics: [data](<https://devfeed.tech/topics/data.md>), [Data structures](<https://devfeed.tech/topics/data-structures.md>), [Library](<https://devfeed.tech/topics/library.md>), [signed distance functions](<https://devfeed.tech/topics/signed-distance-functions.md>)

Tags: [3d](<https://devfeed.tech/tags/3d.md>), [blender](<https://devfeed.tech/tags/blender.md>), [data-structure](<https://devfeed.tech/tags/data-structure.md>), [general-development](<https://devfeed.tech/tags/general-development.md>), [geometry-nodes](<https://devfeed.tech/tags/geometry-nodes.md>), [library](<https://devfeed.tech/tags/library.md>), [sdf](<https://devfeed.tech/tags/sdf.md>), [volume](<https://devfeed.tech/tags/volume.md>)

### AI overview

Blender 5.0 expands Geometry Nodes support for volumetric data with a new volume grid data type. Grids can store float, vector, and other primitive values, be modified with math nodes, and be viewed or attached to geometry.

### Source excerpt

In Blender 5.0, Geometry Nodes support for volumetric data will be significantly better.

## Perfecting anti-aliasing on signed distance functions

DevFeed: [Perfecting anti-aliasing on signed distance functions](<https://devfeed.tech/articles/perfecting-anti-aliasing-on-signed-distance-functions-26118.md>)

Original publisher: [Read original article](<http://blog.pkh.me/p/44-perfecting-anti-aliasing-on-signed-distance-functions.html>)

Published: 2025-07-26T14:29:32Z

Content type: article

Language: en

Sources: [The Last Static Blog RSS](<https://devfeed.tech/sources/the-last-static-blog-rss.md>)

Topics: [signed distance functions](<https://devfeed.tech/topics/signed-distance-functions.md>), [SDF](<https://devfeed.tech/topics/sdf.md>)

Tags: [functions](<https://devfeed.tech/tags/functions.md>), [graphics](<https://devfeed.tech/tags/graphics.md>), [math](<https://devfeed.tech/tags/math.md>), [prog](<https://devfeed.tech/tags/prog.md>), [sdf](<https://devfeed.tech/tags/sdf.md>), [signed-distance-functions](<https://devfeed.tech/tags/signed-distance-functions.md>), [visualization](<https://devfeed.tech/tags/visualization.md>)

### AI overview

This article explains why anti-aliasing signed distance functions is more complicated than applying hardcoded constants or generic formulas. It develops anti-aliasing approaches from SDF properties such as the unit-length gradient and considers both inside/outside sign conventions.

### Source excerpt

Doing anti-aliasing on SDF is not as straightforward as it seems. Most of the time, we see people use a smoothstep with hardcoded constants, sometimes with screen space information, sometimes cryptic or convoluted formulas. Even if SDFs have the perfect mathematical properties needed for a clean anti-aliasing, the whole issue has a scope larger than it appears at first glance. And even when trivial solutions exist, it's not always clear why they are a good fit. Let's study that together. SDF The article assumes that you are at least a bit familiar with what an SDF is, but if I had to provide a quick and informal definition, I would say something like: "It's a function (or lookup-table of said function, usually stored in a texture) which returns the signed distance from the specified coordinates to a given shape, where the sign indicates whether you're inside or outside the shape." A common visualization of it looks like this: SDF of a moving pie/pacman, using Inigo Quilez formula and colorscheme for visualization The distance is fancily colored here for illustrative purpose, and the shape is animated to see how it affects the field. Another way of seeing it is to switch to a 3D view: SDF of a moving pie/pacman, as seen in 3D For the sign interpretation, here we're using the convention positive inside and negative outside, as seen for example on the Wikipedia illustration. But this is not always the case, for example, Inigo prefers the opposite: negative inside and positive outside. I personally find the Wikipedia convention to be more intuitive and easy to work with, but that's a matter of preferences so we'll figure out the formulas for both models. Switching from one to the other is just a sign swap, but it's important to know what we are working with. Linear ramp A properly crafted SDF has a gradient of length 1, meaning the slope is either going up or down, but always at the same constant rate of 1: 1D side cut of an SDF depicting the gradient/slope This is an i