Skip to content

Lag when scrolled over section with background on website #54

Open
@1j01

Description

The section with a fancy tessellating cursors background that I designed is causing lag on my phone.
I think background-blend-mode: overlay is too intensive for my phone, or maybe background-attachment: fixed or the combination, but probably just the blend mode.

  • maybe use two backgrounds, one a linear-gradient to get a solid color over top
  • maybe use a separate div for an extra background-color on top
  • maybe use precomposed background images for light and dark themes

I'm not sure a translucent solid color on top would have the same effect as the overlay, so precomposing images could preserve the current look, but reducing contrast further might be a good thing, The text can be hard to read over the background.

Also ideally the background would wrap... On my desktop, this doesn't come into play, but on my mobile, I can see a seam, if I scroll it so the section is towards the bottom of the screen.

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't workingdocumentationImprovements or additions to documentation

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions