GV

GeezerVison

The World Wide Web, restored to 800 pixels of glory.

Home|About|Gaming cabinet|Archives|How it works|Starter sites

On this site

  • Sign in
  • ActionsCI/CD and automation
  • CodespacesCloud development environments
  • All Features
  • Documentation
  • Training
  • Certifications
  • Build with Copilot
  • Customize Copilot
  • Integrations
  • Trending repos
  • GitHub Sponsors
  • Developer articles
  • Enterprises

This view

  • Original page
  • New address

GeezerVison is showing github.com — doc: optimize HTML rendering by aduh95 · Pull Request #37301 · nodejs/node

Conversation

@aduh95

@aduh95 aduh95 commented Feb 9, 2021

Copy link
Copy Markdown
Contributor

Defer rendering sections of docs until they are displayed on the user's screen.

Rendering+painting time of all.html on master is ~1min on my machine:
screenshot of Chrome DevTools Performance tab, rendering time is 53089 ms, painting time is 3491 ms

Rendering+painting time of all.html on this branch is ~1s on my machine:
screenshot of Chrome DevTools Performance tab 937 ms, painting time is 51 ms

This feature is only available for Chromium browsers using version 85+ (https://caniuse.com/?search=content%20visibility), and won't change much for other browsers.

Sorry, something went wrong.

Uh oh!

There was an error while loading. Please reload this page.
RaisinTen, Lxxyx, v1rtl, razh, vinayakkulkarni, bcoe, juanarbol, shisama, marvinhagemeister, mathiasbynens, and 5 more reacted with rocket emoji
All reactions
  • 🚀 15 reactions
@nodejs-github-bot nodejs-github-bot added doc Issues and PRs related to Node.js documentation. tools Issues and PRs related to the tools directory. labels Feb 9, 2021
RaisinTen
RaisinTen approved these changes Feb 10, 2021
View reviewed changes
RaisinTen
RaisinTen reviewed Feb 10, 2021
View reviewed changes
Comment thread tools/doc/html.js Resolved

Uh oh!

There was an error while loading. Please reload this page.
RaisinTen
RaisinTen reviewed Feb 10, 2021
View reviewed changes
Comment thread tools/doc/html.js Resolved

Uh oh!

There was an error while loading. Please reload this page.
@RaisinTen

RaisinTen commented Feb 10, 2021

Copy link
Copy Markdown
Member

Should we use this syntax instead? I'm suggesting this based on the other functions in the file.
aduh95 reacted with thumbs up emoji
All reactions
  • 👍 1 reaction

Sorry, something went wrong.

Uh oh!

There was an error while loading. Please reload this page.
@aduh95 aduh95 added the author ready PRs with CI started, the required approvals, and no outstanding review comments. label Feb 11, 2021
@nodejs-github-bot

nodejs-github-bot commented Feb 11, 2021

Copy link
Copy Markdown
Collaborator

CI: https://ci.nodejs.org/job/node-test-pull-request/36057/
All reactions

Sorry, something went wrong.

Uh oh!

There was an error while loading. Please reload this page.
jasnell
jasnell approved these changes Feb 15, 2021
View reviewed changes
@aduh95
doc: optimize HTML rendering
0177d4c 
Defer rendering sections of docs until they are displayed on
the user's screen.

PR-URL: nodejs#37301
Reviewed-By: Darshan Sen <[email protected]>
Reviewed-By: James M Snell <[email protected]>
@aduh95
aduh95 force-pushed the doc-content-visibility branch from d226aca to 0177d4c Compare February 15, 2021 15:14
@aduh95

aduh95 commented Feb 15, 2021

Copy link
Copy Markdown
Contributor Author

Landed in 0177d4c
All reactions

Sorry, something went wrong.

Uh oh!

There was an error while loading. Please reload this page.
@aduh95
aduh95 merged commit 0177d4c into nodejs:master Feb 15, 2021
@aduh95
aduh95 deleted the doc-content-visibility branch February 15, 2021 15:15
@Trott

Trott commented Feb 16, 2021

Copy link
Copy Markdown
Member

This change landed despite a failing Jenkins CI and now Jenkins is broken. This change breaks test/doctool/test-doctool-html.js.
All reactions

Sorry, something went wrong.

Uh oh!

There was an error while loading. Please reload this page.
@Trott

Trott commented Feb 16, 2021

Copy link
Copy Markdown
Member

The fix appears to be just adding <section> tags to the expected results. Going to try to fix it now, but if someone beats me to it, great.
All reactions

Sorry, something went wrong.

Uh oh!

There was an error while loading. Please reload this page.
@aduh95

aduh95 commented Feb 16, 2021

Copy link
Copy Markdown
Contributor Author

@Trott On it.
danielleadams reacted with thumbs up emoji
All reactions
  • 👍 1 reaction

Sorry, something went wrong.

Uh oh!

There was an error while loading. Please reload this page.
@aduh95 aduh95 mentioned this pull request Feb 16, 2021
test: fix test-doctool-html #37397
Merged
@aduh95

aduh95 commented Feb 16, 2021

Copy link
Copy Markdown
Contributor Author

Isn't it weird the test failure is reported on for Windows CI?
All reactions

Sorry, something went wrong.

Uh oh!

There was an error while loading. Please reload this page.
@Trott

Trott commented Feb 16, 2021

Copy link
Copy Markdown
Member

Isn't it weird the test failure is reported on for Windows CI?

I guess we're only running doctool there? I don't know, that is surprising.
All reactions

Sorry, something went wrong.

Uh oh!

There was an error while loading. Please reload this page.
@aduh95

aduh95 commented Feb 16, 2021

Copy link
Copy Markdown
Contributor Author

Isn't it weird the test failure is reported on for Windows CI?

I guess we're only running doctool there? I don't know, that is surprising.

Attempt to fix that in #37398.
All reactions

Sorry, something went wrong.

Uh oh!

There was an error while loading. Please reload this page.
aduh95 added a commit to aduh95/node that referenced this pull request Feb 16, 2021
@aduh95
test: fix test-doctool-html
1c6484b 
Refs: nodejs#37301

PR-URL: nodejs#37397
Reviewed-By: Danielle Adams <[email protected]>
Reviewed-By: Rich Trott <[email protected]>
Reviewed-By: Darshan Sen <[email protected]>
danielleadams pushed a commit that referenced this pull request Feb 16, 2021
@aduh95 @danielleadams
doc: optimize HTML rendering
dd054ca 
Defer rendering sections of docs until they are displayed on
the user's screen.

PR-URL: #37301
Reviewed-By: Darshan Sen <[email protected]>
Reviewed-By: James M Snell <[email protected]>
danielleadams pushed a commit that referenced this pull request Feb 16, 2021
@aduh95 @danielleadams
test: fix test-doctool-html
b5692b4 
Refs: #37301

PR-URL: #37397
Reviewed-By: Danielle Adams <[email protected]>
Reviewed-By: Rich Trott <[email protected]>
Reviewed-By: Darshan Sen <[email protected]>
This was referenced Feb 16, 2021
v15.9.0 proposal #37405
Closed
v15.9.0 proposal #37406
Merged
@kurtextrem

kurtextrem commented Feb 28, 2021

Copy link
Copy Markdown

How were the 5000px calculated? (for intrinsic-size)
What happens if content gets larger than that?
All reactions

Sorry, something went wrong.

Uh oh!

There was an error while loading. Please reload this page.
@aduh95

aduh95 commented Feb 28, 2021 •
edited
Loading

Uh oh!

There was an error while loading. Please reload this page.

Copy link
Copy Markdown
Contributor Author

How were the 5000px calculated? (for intrinsic-size)

It wasn't calculated, it's just a random value which is supposed to be greater than the user screen height.

What happens if content gets larger than that?

Nothing – until the user scrolls near the supposed element position, and the browser will have to render the actual content. The only (I think) visible consequence is the scroll bar doing some weird jumps when scrolling (and the much improved render time of course). You can already check how it performs by visiting https://nodejs.org/api/all.html.
All reactions

Sorry, something went wrong.

Uh oh!

There was an error while loading. Please reload this page.
@Trott Trott mentioned this pull request Mar 20, 2021
doc,tools: use only one level 1 header per page #37839
Merged
targos pushed a commit that referenced this pull request May 1, 2021
@aduh95 @targos
doc: optimize HTML rendering
2a3feff 
Defer rendering sections of docs until they are displayed on
the user's screen.

PR-URL: #37301
Reviewed-By: Darshan Sen <[email protected]>
Reviewed-By: James M Snell <[email protected]>
targos pushed a commit that referenced this pull request May 1, 2021
@aduh95 @targos
test: fix test-doctool-html
8386b88 
Refs: #37301

PR-URL: #37397
Reviewed-By: Danielle Adams <[email protected]>
Reviewed-By: Rich Trott <[email protected]>
Reviewed-By: Darshan Sen <[email protected]>
@danielleadams danielleadams mentioned this pull request May 3, 2021
v14.17.0 proposal #38507
Merged
@aduh95 aduh95 mentioned this pull request Sep 13, 2021
doc: weird scrolling/anchor behavior in Chrome and Firefox #40099
Closed
saltybuckets added a commit to saltybuckets/node that referenced this pull request Sep 25, 2021
@saltybuckets
subsystem:doc
5322a0d 
This pr fixes the jittery scrolling behavior introduced in
nodejs#37301

fix:nodejs#40099
refs:https://infrequently.org/2020/12/resize-resilient-deferred-rendering/
@saltybuckets saltybuckets mentioned this pull request Sep 25, 2021
fix jittery scrolling #40215
Closed
@tniessen tniessen mentioned this pull request Feb 6, 2022
Remove content-visibility hack from the docs #41869
Closed
This was referenced Jun 29, 2024
Documentation jump-to-header is buggy #53584
Closed
doc: hash navigation seems broken #39776
Closed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@RaisinTen RaisinTen RaisinTen approved these changes
@jasnell jasnell jasnell approved these changes

Uh oh!

There was an error while loading. Please reload this page.

Assignees

No one assigned

Labels

author ready PRs with CI started, the required approvals, and no outstanding review comments. doc Issues and PRs related to Node.js documentation. tools Issues and PRs related to the tools directory.

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

Uh oh!

There was an error while loading. Please reload this page.

6 participants

@aduh95 @RaisinTen @nodejs-github-bot @Trott @kurtextrem @jasnell
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
You are visitor 01402503 — GeezerVison does not store the pages you look up.
Best viewed with Netscape Navigator 4.7 or Internet Explorer 6 at 800×600. No cookies required.