anup-a / mesh-gradient.js

A tiny utility library to generate mesh gradient based on 4 RGB colors, built with vanilla js.
https://meshgradient.in
MIT License
57 stars 2 forks source link

Not working on Chrome windows #2

Open jpdery opened 1 year ago

jpdery commented 1 year ago

Hi,

I'm trying to make this library works on Chrome Windows but I get the following error:

`webgl.js:92 error X3504: literal loop terminated early due to out of bounds array access C:\fakepath(372,26-35): error X3696: infinite loop detected - loop never exits

error X3504: literal loop terminated early due to out of bounds array access C:\fakepath(372,26-35): error X3696: infinite loop detected - loop never exits

Warning: D3D shader compilation failed with default flags. (vs_5_0) Retrying with skip validation error X3504: literal loop terminated early due to out of bounds array access C:\fakepath(372,26-35): error X3696: infinite loop detected - loop never exits

Warning: D3D shader compilation failed with skip validation flags. (vs_5_0) Retrying with skip optimization error X3504: literal loop terminated early due to out of bounds array access C:\fakepath(372,26-35): error X3696: infinite loop detected - loop never exits

Warning: D3D shader compilation failed with skip optimization flags. (vs_5_0)

Failed to create D3D Shaders`

It works fine on Edge (Windows) and Firefox (Windows) as well as chrome on mac.

Any ideas ?

Thanks

anup-a commented 1 year ago

@jpdery That's very weird. Personally, I don't use a windows PC, so can't reproduce it immediately. But will sure look into it. Additionally, may I know what version of chrome are you running?

jpdery commented 1 year ago

I'm using 109.0.5414.75

I've looked online a bit and it seems that the library you're using behind the scene do work though. Maybe it's only about updating it

https://www.bram.us/2021/10/13/how-to-create-the-stripe-website-gradient-effect/

Thanks

anup-a commented 1 year ago

@jpdery Indeed, the lib it uses behind the scenes is the same as mentioned in the article.

As I checked there is a slight modification I made, which is preserveDrawingBuffer: true

This makes webgl not clear the canvas after compositing the canvas with the rest of the page but prevents certain possible optimizations.

Can you check for