Skip to content

Implement Progressive Image Loading #1958

Open
@revanth0212

Description

@revanth0212

Is your feature request related to a problem? Please describe.
Images in the gallery page only have 2 states, load full image or don't load at all.

image

Describe the solution you'd like
Load images progressively.

image

  1. UI Requests image.
  2. Service Worker intercepts the image request. If the image is present in the cache or a better image is present in the cache, return it.
  3. If there is a low res version of it is available in the cache, return it and fetch a high res version in the background. Once it is returned by the server, send a message to the UI component to update to get the new version.
  4. If no version of this image is present in the cache, fetch and return ultra low res version and also fetch high res version. Once the high res is available, send a message to the UI component to update.

Describe alternatives you've considered
Doing the same on UI but this puts a load on the main thread.

Additional context
This is similar to what Medium does. The important word is similar, not the same.

Please let us know what packages this feature is in regards to:

  • venia-concept
  • venia-ui
  • pwa-buildpack
  • peregrine
  • pwa-devdocs
  • upward-js
  • upward-spec
  • create-pwa

Metadata

Metadata

Assignees

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions