Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Removing ThreeJS #1

Closed
jagenjo opened this issue Oct 10, 2023 · 7 comments
Closed

Removing ThreeJS #1

jagenjo opened this issue Oct 10, 2023 · 7 comments

Comments

@jagenjo
Copy link

jagenjo commented Oct 10, 2023

I see you are using THREEJS for the CRT filter. If that is the case using a css filter will save you lots of space, or I can make a WebGL wrapper that only executes that shader without any THREEJS code. Let me know if you are interested.

@btco
Copy link
Owner

btco commented Oct 10, 2023

CSS wouldn't do it because I want the screen to be warped like a TV screen, which (I believe) CSS can't do.
Also, I'm using Three.js's bloom effect in addition to my custom shader.

So I'd be happy to switch to a WebGL solution if it kept these 3 things (warped TV screen, bloom and my noise+scanlines shader). That would allow me to get rid of THREE.js, which is a huge dependency!

@jagenjo
Copy link
Author

jagenjo commented Oct 11, 2023

All three are possible in CSS, check this guide: https://developer.chrome.com/blog/introduction-to-custom-filters-aka-css-shaders/

But if that doesnt work, I have this tiny webgl library, I could port the shaders there: https://github.com/jagenjo/js13k2023/blob/main/src/microgl.js

@btco
Copy link
Owner

btco commented Oct 16, 2023

Ah! That's amazing! However, I'd rather wait until CSS support for custom filter hits the mainstream browsers (if I understand correctly, it needs Chrome Canary and etc).

I think I'm ok keeping Three.js for now, but maybe I'll revisit the idea of doing it in pure WebGL in the future.

@jagenjo
Copy link
Author

jagenjo commented Oct 17, 2023

ok then, btw: https://caniuse.com/css-filters

@jagenjo jagenjo closed this as completed Oct 17, 2023
@ulken
Copy link

ulken commented Oct 27, 2023

@btco just curious, did you read the date on the Chrome article provided? It was written in 2013 and last updated in 2020. I'd say CSS filters are very much supported in all major browsers.

@btco
Copy link
Owner

btco commented Oct 27, 2023 via email

@ulken
Copy link

ulken commented Oct 27, 2023

Ah, you're right. My bad.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants