HACKER Q&A
📣 winaviation

How could I optimize the performance of my web Liquid (Gl)ass project?


Repo: https://github.com/winaviation/liquid-web

I have been trying to make the Liquid Glass effects in the kube.io LG blog (https://kube.io/blog/liquid-glass-css-svg) usable with JS modules. The thing is, the performance is absolutely cooked on low-end or even med-end hardware if you use big sized Liquid Glass components.

Would love some feedback on how to make this actually usable for the average user without turning their device to a heater.


  👤 vincent-uden Accepted Answer ✓
Benchmark, benchmark and benchmark. Chrome has really good performance benchmarking tools. Find your expensive hot spots and see what can be cached.

Hopefully you'll find some significant hotspots dominating the performance of the effect. If not, you have to reconsider the approach entirely.