shadertoy | This is an wgpu backed implementation of shadertoy | Graphics library

Consider the simple shader below (header over to shadertoy.com/new and paste the code to try it out).

Basically, I'm trying to figure out if it is possible to tweak the dot() version to get the exact same result for these two function calls:

Running a Surface Laptop 3 with Intel® Iris® Plus Graphics (driver version 30.0.101.1191). Perhaps I'm facing a bug in Intel's shader compiler. Though, I have limited experience of shaders in general, so perhaps the behavior below is expected.

Head over to https://www.shadertoy.com/new and try the shader below. For some reason, defining a float d = 1.0 seems to produce different results compared to a compile-time constant of 1.0.

So I have been trying to figure out why I keep getting this error, even though everything is run from my game_view.py module. Everytime I press the 1 key to start a game and test to see if the players health bar and hit points works, I get this error message. TypeError: start_new_game() missing 1 required positional argument: 'max_health'

The sad part is, is that it reffers me to the start_view which doesn't have anything to do with anything else but running the start screen so players can choose to play solo or with another player. Below is the game_view and start_view so you guys can see where I'm going wrong. I wanted to test this out so this way I can add other enemies, bosses and power-ups later, but running into this error for the past several days is hindering progress. Anyway, code for both will be below. Thanks in advance for any and all help.

In the following shadertoy I illustrate an artefact that occurs when raymarching

https://www.shadertoy.com/view/stdGDl

This is my "scene" (see code fragment below). It renders a primitive "tunnel_fragment" which is an SDF (Signed Distance Function), and uses modulo on the coordinates to calculate "infinite" repetitions of these fragments. It then also calculates which disk we are in (odd/even) to displace them.

I really don't understand why these artefacts occur when the disks (or rings -> see tunnel_fragment, if you remove a comment they become rings instead of disks) present these artefacts when the alternate movement in x direction becomes large.

These artefacts don't appear when the disk structure moves to the right on its whole, it only appears when the disks alternate and the entire structure becomes more complex.

What am I doing wrong? It's really boggling me.

I know that I can perform a transformation(rotation,scale) in the vertex shader. However I wonder if I can do the similar thing in the fragment shader.

shadertoy.com - transformation_in_fragment_shade

I tried to apply transformation in fragment shader by multiply the uv but being confused by the result.

Im new to programming shaders and i want to create a shader with webgl and glsl. To see how it really works i want to test a shader from shadertoy. But how do you take the code from shadertoy and actually get to run it in a js file ? Do you just need to copy the code from shadertoy into the fragment shader or what. If you have an answer please help me.

I cannot find any WebGL fragment shader that will maintain 60fps in a mobile browser. They will run smoothly at first, but over the course of a few minutes will inexorably slow and stutter.

Here's a simple example to demonstrate the problem. http://glslsandbox.com/e#74134.2

Here it is running for a few minutes on iPadOS. https://youtu.be/oVPVER9RCP0

Are shaders like this simply not an option on mobile devices?

Update: This apparently only applies to WebGL1 contexts. On websites that use WebGL2, such as ShaderToy, the shaders run smoothly.

https://www.shadertoy.com/view/4tfXzl

Fragment shader with minor changes:

The app is based on PyOpenGL (core profile) and using orthographic projection. I have to draw several different 2d shapes on a quad(2 triangles).

I have found a really great article on rendering 2d/3d shapes using SDF. The first shape I'm trying is a rounded rectangle with border. This Shadertoy example perfectly fits to my requirement. Here are my two shaders:

VERTEX SHADER