shuding / cobe

5kB WebGL globe lib.
https://cobe.vercel.app
MIT License
3.22k stars 174 forks source link

White flash on page load (noticeable only on black/dark backgrounds) #84

Open rohanharikr opened 1 year ago

rohanharikr commented 1 year ago

First of all, thank you for creating this library! The design and API is slick :^)

There seems to be a white flash on page load where the cobe globe is, noticeable only on dark backgrounds.

To replicate:

  1. Go to https://cobe.vercel.app/
  2. Switch from "Light" to "Dark" in the footer of the website
  3. Keep reloading - this happens inconsistently

What I have tried: setting a background-color property on the <canvas> element, but the white flash persists.

In https://cobe.vercel.app/, the transition is less jarring because there is a borderRadius: 50% applied to the canvas, causing a white circular flash when in normal cases would be a rectangular flash.

https://github.com/shuding/cobe/assets/12775813/cc042915-d6ed-4aa3-ab55-98abf40dd2db

shuding commented 10 months ago

Have you tried giving the <canvas> a transparent background via CSS?

rohanharikr commented 10 months ago

@shuding Yes, tried inlining background: transparent and also setting via CSS - white flash (inconsistent on page load) persists.