Project

General

Profile

Actions

Feature proposal #8867

open

Improve infinite scroll browser performance

Added by krileon 12 months ago. Updated 12 months ago.

Status:
Assigned
Priority:
Normal
Assignee:
Target version:
Start date:
18 February 2022
Due date:
% Done:

0%

Estimated time:

Description

Implement the usage of the following CSS rules to shut off the rendering processing entirely for activity entries that are offscreen.

content-visibility: hidden;
contain-intrinsic-size: 0 500px;

Use contain-intrinsic-size to set the size. Best way to do this is probably set an inline style var then use the var in a CSS rule. When something is offscreen we just then need to apply the offscreen class and set the var style height based off the content height.

This is available in all major versions and it's non-breaking so if a browser doesn't support it it's fine and that browser will just have some less performance.

Actions #1

Updated by krileon 12 months ago

Also need to set content-visibility: auto; for below-the-fold rendering performance benefits. This allows the renderer to skip activity entries that aren't even visible. It will be important to set contain-intrinsic-size though, which means determining some kind of minimum height.

Actions #2

Updated by krileon 12 months ago

Only JS needed will be setting the height more specifically from the generic value. content-visibility: auto; itself will handle the visibility checks.

Actions

Also available in: Atom PDF