30th week shader

CSS in JS is back

Kuma UI is a compiler time CSS in JS library. It is a better alternative to Tailwind CSS. It can be used with Panda CSS

NextJS & Remix

Compared NextJS and Remix. Remix is fully server rendered.

Use Preact with react-babylonjs

preact-reconciler is an adapter for Preact to work with react-babylonjs or R3F.

WebXR

Mixed Reality Resources collects the datas about XR resources. Can download some library on it.

This is an XR input playground for BabylonJS.

Using WebXR on phone is hard. It is only supported on Chrome Canary. It is not working on Safari even opened the experimental features.

Testing the web on mobile need a cable connect. But there is a JS console Eruda can help.

Another choice is to use Babylon React Native, which uses React Native as a bridge to use ARcore or ARkit. Sadly Oculus dose not support ARcore. However, it seems Oculus uses React Native on it’s Home Launcher. And they are working on supporting Vision OS.

This is a book about React Native.

BabylonJS

To make an orthographic camera in BabylonJS, can refer to this link.

CYOS is a BabylonJS shader editor.

BabylonJS Viewer uses web component to build a 3D viewer.

Can use Poly Pizza to download mesh models.

Can download free shaders on ShaderToy.

AI generated SVGs

Using Craft AI, can make AI generated SVGs for free. This is a blog about SVG paths, maintainer is a vercel employee.

Crash an SVG path on WebGL

This is a threeJS example to render SVG path on WebGL with shaders. I am trying to make it work on BabylonJS and learn how to write shaders.

This is a crash course about shaders.

To make vertex change without shader, can refer to this link.

About how to use a node editor can refer to this

This is an example to send attribute data to shader using instanceBuffer.

This is a nice tutorial about how to write shaders in BabylonJS.

This is a firework effect using shader.

A fancy Babylon Effect I want to figure out.

run JS in compiling time

Since React Server Component runs component on server, I was thinking to run a component on compiling time. This plugin can do that.

Also there is a plugin to help build a universal plugin for Vite, Rollup, Webpack and more.