Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Draft: Lazy Image Loading #24142

Draft
wants to merge 2 commits into
base: trunk
Choose a base branch
from
Draft

Draft: Lazy Image Loading #24142

wants to merge 2 commits into from

Conversation

kean
Copy link
Contributor

@kean kean commented Mar 4, 2025

In the current implementation, including the production version, when the comment that has media is loading, you can see part of the text but the height of the cell isn't updated until the image is loaded.

before.mov

It's possible to update the height dynamically as the page is loading by observing webKit.scrollView.contentSize. For best use experience, it should also show some kind of placeholders during loading.

This implementation should also enable correct rendering of features like dropdown or excerpts in comments that add/remove content from the "page". Unfortunately, I couldn't quite get it to work reliably with the WKWebView reuse in place. This PR covered WIP.

after.mov

Notes

  • func webView(_ webView: WKWebView, didFinish navigation: WKNavigation!) gets called when all image are loaded
  • webView.scrollView.contentSize reports incorrect size that almost never quite matches the scroll height of the page
  • ReaderDetailsViewController implements something similar but it doesn't have the same constraints: reuse of WKWebView.

To test:

Regression Notes

  1. Potential unintended areas of impact

  2. What I did to test those areas of impact (or what existing automated tests I relied on)

  3. What automated tests I added (or what prevented me from doing so)

PR submission checklist:

  • I have completed the Regression Notes.
  • I have considered adding unit tests for my changes.
  • I have considered adding accessibility improvements for my changes.
  • I have considered if this change warrants user-facing release notes and have added them to RELEASE-NOTES.txt if necessary.

Testing checklist:

  • WordPress.com sites and self-hosted Jetpack sites.
  • Portrait and landscape orientations.
  • Light and dark modes.
  • Fonts: Larger, smaller and bold text.
  • High contrast.
  • VoiceOver.
  • Languages with large words or with letters/accents not frequently used in English.
  • Right-to-left languages. (Even if translation isn’t complete, formatting should still respect the right-to-left layout)
  • iPhone and iPad.
  • Multi-tasking: Split view and Slide over. (iPad)

@kean kean added the Comments label Mar 4, 2025
@kean kean added this to the Pending milestone Mar 4, 2025
@dangermattic
Copy link
Collaborator

1 Message
📖 This PR is still a Draft: some checks will be skipped.

Generated by 🚫 Danger

@wpmobilebot
Copy link
Contributor

WordPress Alpha📲 You can test the changes from this Pull Request in WordPress Alpha by scanning the QR code below to install the corresponding build.
App NameWordPress Alpha WordPress Alpha
ConfigurationRelease-Alpha
Build Numberpr24142-bfff52b
Version25.7.1
Bundle IDorg.wordpress.alpha
Commitbfff52b
App Center BuildWPiOS - One-Offs #11576
Automatticians: You can use our internal self-serve MC tool to give yourself access to App Center if needed.

@wpmobilebot
Copy link
Contributor

Jetpack Alpha📲 You can test the changes from this Pull Request in Jetpack Alpha by scanning the QR code below to install the corresponding build.
App NameJetpack Alpha Jetpack Alpha
ConfigurationRelease-Alpha
Build Numberpr24142-bfff52b
Version25.7.1
Bundle IDcom.jetpack.alpha
Commitbfff52b
App Center Buildjetpack-installable-builds #10606
Automatticians: You can use our internal self-serve MC tool to give yourself access to App Center if needed.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants