Page MenuHomePhabricator

Editor with syntax highlighting becomes unresponsive after Chrome adds non-passive event listener to a scroll-blocking event
Closed, ResolvedPublicBUG REPORT

Description

Background

  • Over the past few months, mouse and keyboard movements in my editor have become increasingly unresponsive on pages with heavy syntax highlighting (i.e., lots of refs). Small sections load okay, for the most part, but full page edits with lots of highlighting, after a few glorious seconds of working fine, become extremely sluggish to interaction. Mouse- or keyboard-highlighting or navigating text takes multiple seconds to display and stays permanently behind.
  • I've narrowed this slowdown to when syntax highlighting is turned on (in the 2010 toolbar—the only way I know to change it). It occurs on any page I edit when this feature is active and the toolbar is not togged off altogether.
  • If useful, several of the warnings in the console just prior to the slowdown read: [Violation] Added non-passive event listener to a scroll-blocking 'mousewheel' event. Consider marking event handler as 'passive' to make the page more responsive. See https://www.chromestatus.com/feature/5745543795965952

Reproducing

  • Open any long English Wikipedia page for editing in Chrome (tested in incognito too) with 2010 editor and syntax highlighting on
  • After a few seconds, warnings will post in the Chrome log, corresponding with the slowdown described above

Software version (if not a Wikimedia wiki), browser information, screenshots, other information, etc:

  • Latest stable Chrome on Linux 5.10.84-1-MANJARO x86_64
  • Tested with &safemode=1&debug=yes activated, common.js wiped out, visual editor turned on (is this the "2017 editor"?), different skin, different Chrome profile, logging out and back in
  • Verbose console log: Three unrelated errors followed by four Chrome violations re: non-passive event listeners that should be passive for better responsivity, followed by a bunch of mousedown/mousemove/keydown handler violations

Event Timeline

Restricted Application added a subscriber: Aklapper. · View Herald Transcript
czar renamed this task from 2010 editor becomes unresponsive after Chrome adds non-passive event listener to a scroll-blocking event to Editor with syntax highlighting becomes unresponsive after Chrome adds non-passive event listener to a scroll-blocking event.Jan 1 2022, 9:26 PM
czar updated the task description. (Show Details)
czar updated the task description. (Show Details)
czar updated the task description. (Show Details)

Can you try turning off the built-in spell checker in Chrome's settings? There is a bug in Chrome 96 which has been causing severe slowdown on edit areas for some users: https://bugs.chromium.org/p/chromium/issues/detail?id=1271918. It should be fixed in the next Chrome release.

Looks like that did the trick—thanks! I replicated the issue and then turned off spell check in chrome://settings/?search=spell and reloaded the page and while it still threw 'requestIdleCallback' handler and Forced reflow while executing JavaScript took <N>ms violations, it didn't hang like before.

Great! Chrome 97 is now out (https://chromereleases.googleblog.com/) and fixes this issue, so after updating you can turn spell checking back on.