Optimize images and image loading

Open
  • Is something wrong?
#719 2 comments 0 reactions 0 assignees View on GitHub

Maintainers usually reply within 1 day

@florianeichincode is already working on this.

Since Oct 30, 2026.

Assessment

Difficulty
3/5
Estimated time
1-2 days
Newbie friendliness
45/100
Issue type
Feature
Clarity
Mostly clear
Activity status
Active
Tech stack
html, javascript
Domain
frontend, performance

Research direction

The issue names no specific file, so start by opening the tutorial page locally and listing which img elements load offscreen and lack loading="lazy". Confirm with the maintainers which images and components are in scope before changing any assets, since the author offered to submit optimized images. Done when offscreen images are deferred and the tutorial page's image payload drops by roughly the 2.6MB the author measured.

Written by the indexing model from the issue text.

Description

Opening the tutorial page loads 3.6MB images.
Some of them outside the screen.

This is problematic if a bad internet connection is present.

I have already optimized the images for the tutorials and can create a PR if wanted. -> Saving 2.6MB

Further more the images missing the loading="lazy" attribute for loading lazy if not displayed.

Also the sprites and backdrops can be optimized with correctly optimized images and loading="lazy".

Also can help with that.

I think this can improve the overall performance of the web app.

Dominant language
JavaScript
Stars
310
Forks
299
Avg merge
19h 41m
Merged PRs (30d)
14

Getting set up

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

More from scratchfoundation/scratch-editor

All issues in scratchfoundation/scratch-editor

Similar issues

More JavaScript issues

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.