Performance issue in long code block

[Fred-Vatin]

• [x] The Plugin is up to date (0.4.5)
• [x] Obsidian is up to date (1.7.7)

Describe the bug

When plugin is enabled and note contains long code block, scrolling using mouse wheel or keys: ↓, ↑, PgDn, PgUp, Ctrl+Home, Ctrl+End stutters, makes the note laggy.

To Reproduce

1. Open Obsidian Sandbox vault
2. Install and enable shiki
3. Create a new note and only paste this as json:

{
	"image": "mcr.microsoft.com/devcontainers/universal:2",

	// install extra tools
	"features": {
		// check install with "shfmt --version" in a terminal
		"ghcr.io/devcontainers-extra/features/shfmt:1": {
			"version": "latest"
		},
		// check install with "bun --version" in a terminal
		"ghcr.io/prulloac/devcontainer-features/bun:1": {},
		// check install with "jq --version" and "yq --version" in a terminal
		"ghcr.io/eitsupi/devcontainer-features/jq-likes:2": {
			"jqVersion": "latest",
			"yqVersion": "latest",
			"gojqVersion": "none",
			"xqVersion": "none",
			"jaqVersion": "none"
		}
	},

	"customizations": {
		"vscode": {
			// install VSCode extensions in CodeSpace
			"extensions": [
				"albert.TabOut",
				"alefragnani.Bookmarks",
				"bierner.docs-view",
				"bierner.markdown-preview-github-styles",
				"biomejs.biome",
				"chouzz.vscode-better-align",
				"chunsen.bracket-select",
				"CoenraadS.disableligatures",
				"DavidWang.ini-for-vscode",
				"donjayamanne.githistory",
				"esbenp.prettier-vscode",
				"ExodiusStudios.comment-anchors",
				"foxundermoon.shell-format",
				"Fred-Vatin.never-be-lost",
				"ionutvmi.path-autocomplete",
				"jakearl.search-editor-apply-changes",
				"jakob101.RelativePath",
				"jeff-hykin.better-shellscript-syntax",
				"mdickin.markdown-shortcuts",
				"metaseed.metago",
				"metaseed.MetaJump",
				"metaseed.MetaWord",
				"peterfh.linesinfostatusbar",
				"piotrpalarz.vscode-gitignore-generator",
				"PKief.material-icon-theme",
				"SirTori.indenticator",
				"tamasfe.even-better-toml",
				"Thinker.sort-json",
				"wraith13.zoombar-vscode",
				"yatki.vscode-surround",
				"yechunan.json-color-token"
			],
			// VSCode settings (use ".vscode/settings.json" if you want to override these one)
			"settings": {
				// VSCODE SETTINGS
				"[css]": {
					"editor.defaultFormatter": "biomejs.biome"
					// "editor.parameterHints": false,
					// "editor.quickSuggestions": false
				},
				"[html]": {
					"editor.defaultFormatter": "biomejs.biome"
				},
				"[javascript]": {
					"editor.defaultFormatter": "biomejs.biome"
				},
				"[json]": {
					"editor.defaultFormatter": "biomejs.biome",
					"editor.inlineSuggest.enabled": false,
					"editor.quickSuggestions": {
						"comments": "inline",
						"other": "inline",
						"strings": "inline"
					}
				},
				"[json][jsonc]": {
					"editor.occurrencesHighlight": "singleFile"
				},
				"[jsonc]": {
					"editor.defaultFormatter": "esbenp.prettier-vscode",
					"editor.inlineSuggest.enabled": false,
					"editor.quickSuggestions": {
						"comments": "inline",
						"other": "inline",
						"strings": "inline"
					},
					"editor.selectionHighlight": true
				},
				"[markdown]": {
					"editor.acceptSuggestionOnEnter": "off",
					"editor.formatOnSave": true,
					"editor.renderWhitespace": "all",
					"editor.wordWrap": "on"
				},
				"[plaintext]": {
					"editor.guides.indentation": false,
					"editor.occurrencesHighlight": "off"
				},
				"[yaml]": {
					"editor.autoIndent": "advanced",
					"editor.defaultFormatter": "esbenp.prettier-vscode",
					"editor.detectIndentation": false,
					"editor.insertSpaces": true,
					"editor.tabSize": 2
				},
				"css.completion.completePropertyWithSemicolon": true,
				"css.format.spaceAroundSelectorSeparator": true,
				"css.lint.argumentsInColorFunction": "error",
				"css.lint.boxModel": "warning",
				"css.lint.compatibleVendorPrefixes": "warning",
				"css.lint.duplicateProperties": "warning",
				"css.lint.emptyRules": "warning",
				"css.lint.float": "warning",
				"css.lint.fontFaceProperties": "warning",
				"css.lint.hexColorLength": "error",
				"css.lint.idSelector": "warning",
				"css.lint.importStatement": "warning",
				"css.lint.propertyIgnoredDueToDisplay": "warning",
				"css.lint.universalSelector": "warning",
				"css.lint.unknownProperties": "warning",
				"css.lint.unknownVendorSpecificProperties": "warning",
				"css.lint.zeroUnits": "warning",
				"debug.allowBreakpointsEverywhere": true,
				"debug.console.fontSize": 16,
				"debug.inlineValues": "on",
				"debug.javascript.pickAndAttachOptions": {},
				"debug.showBreakpointsInOverviewRuler": true,
				"editor.acceptSuggestionOnCommitCharacter": false,
				"editor.acceptSuggestionOnEnter": "off",
				"editor.accessibilitySupport": "off",
				"editor.autoIndent": "full",
				"editor.colorDecoratorsActivatedOn": "click",
				"editor.cursorBlinking": "phase",
				"editor.cursorSmoothCaretAnimation": "on",
				"editor.cursorSurroundingLines": 5,
				"editor.cursorWidth": 2,
				"editor.detectIndentation": false,
				"editor.dragAndDrop": false,
				"editor.find.autoFindInSelection": "multiline",
				"editor.find.cursorMoveOnType": false,
				"editor.find.seedSearchStringFromSelection": "always",
				"editor.foldingStrategy": "auto",
				"editor.fontFamily": "'Fira Code', 'FiraCode Nerd Font Mono', 'Cascadia Code PL', 'Monaco', 'Consolas', 'Segoe UI Emoji', monospace",
				"editor.fontLigatures": "'ss01', 'ss03', 'ss04', 'ss05', 'ss07', 'zero'",
				"editor.fontSize": 16,
				"editor.fontWeight": "400",
				"editor.formatOnPaste": true,
				"editor.formatOnSave": true,
				"editor.formatOnType": true,
				"editor.glyphMargin": true,
				"editor.guides.bracketPairs": true,
				"editor.guides.indentation": false,
				"editor.hover.above": false,
				"editor.hover.delay": 1000,
				"editor.inlayHints.enabled": "offUnlessPressed",
				"editor.inlayHints.fontSize": 14,
				"editor.inlayHints.padding": true,
				"editor.inlineSuggest.syntaxHighlightingEnabled": true,
				"editor.insertSpaces": false,
				"editor.linkedEditing": true,
				"editor.minimap.enabled": false,
				"editor.minimap.scale": 2,
				"editor.minimap.showSlider": "always",
				"editor.minimap.size": "fit",
				"editor.mouseWheelZoom": true,
				"editor.multiCursorModifier": "ctrlCmd",
				"editor.multiDocumentOccurrencesHighlight": true,
				"editor.occurrencesHighlight": "off",
				"editor.parameterHints.enabled": false,
				"editor.quickSuggestionsDelay": 10,
				"editor.renderControlCharacters": true,
				"editor.renderLineHighlight": "all",
				"editor.renderWhitespace": "none",
				"editor.semanticHighlighting.enabled": true,
				"editor.smoothScrolling": true,
				"editor.suggest.insertMode": "replace",
				"editor.suggest.preview": true,
				"editor.suggest.showStatusBar": true,
				"editor.tabCompletion": "on",
				"editor.tabSize": 2,
				"editor.unfoldOnClickAfterEndOfLine": true,
				"editor.unicodeHighlight.nonBasicASCII": false,
				"editor.wordWrap": "off",
				"explorer.confirmDelete": false,
				"explorer.confirmDragAndDrop": false,
				"extensions.autoUpdate": false,
				"files.associations": {
					"*.inc": "ini"
				},
				"files.autoGuessEncoding": true,
				"files.autoSave": "off",
				"files.autoSaveDelay": 1000,
				"files.defaultLanguage": "${activeEditorLanguage}",
				"files.encoding": "utf8",
				// "files.eol": "\r\n", //CRLF
				"files.hotExit": "onExit",
				"files.insertFinalNewline": true,
				"files.trimTrailingWhitespace": true,
				"git.allowForcePush": true,
				"git.autoStash": true,
				"git.autofetch": true,
				"git.confirmSync": false,
				"git.mergeEditor": true,
				"git.smartCommitChanges": "tracked",
				"git.terminalGitEditor": true,
				"html.format.contentUnformatted": "pre",
				"html.format.extraLiners": "head, body, /html",
				"html.format.indentInnerHtml": false,
				"html.format.maxPreserveNewLines": 1,
				"html.format.preserveNewLines": true,
				"html.format.unformatted": "wbr",
				"html.format.wrapAttributes": "preserve-aligned",
				"javascript.inlayHints.enumMemberValues.enabled": true,
				"javascript.inlayHints.functionLikeReturnTypes.enabled": true,
				"javascript.inlayHints.parameterNames.enabled": "all",
				"javascript.inlayHints.parameterTypes.enabled": true,
				"javascript.inlayHints.propertyDeclarationTypes.enabled": true,
				"javascript.inlayHints.variableTypes.enabled": true,
				"javascript.referencesCodeLens.enabled": true,
				"javascript.referencesCodeLens.showOnAllFunctions": true,
				"javascript.suggest.completeFunctionCalls": true,
				"js/ts.implicitProjectConfig.checkJs": true,
				"jsonColorToken.languages": [
					"json",
					// "jsonc",
					"tmTheme",
					"xml"
				],
				"less.completion.completePropertyWithSemicolon": true,
				"scm.alwaysShowActions": true,
				"scss.completion.completePropertyWithSemicolon": true,
				"scss.lint.argumentsInColorFunction": "error",
				"scss.lint.boxModel": "warning",
				"scss.lint.compatibleVendorPrefixes": "warning",
				"scss.lint.duplicateProperties": "warning",
				"scss.lint.emptyRules": "warning",
				"scss.lint.float": "warning",
				"scss.lint.fontFaceProperties": "warning",
				"scss.lint.hexColorLength": "error",
				"scss.lint.idSelector": "warning",
				"scss.lint.importStatement": "warning",
				"scss.lint.propertyIgnoredDueToDisplay": "warning",
				"scss.lint.universalSelector": "warning",
				"scss.lint.unknownProperties": "warning",
				"scss.lint.unknownVendorSpecificProperties": "warning",
				"scss.lint.zeroUnits": "warning",
				"search.searchEditor.reusePriorSearchConfiguration": true,
				"search.useGlobalIgnoreFiles": true,
				"security.workspace.trust.untrustedFiles": "open",
				"terminal.integrated.cursorBlinking": true,
				"terminal.integrated.cursorStyle": "line",
				"terminal.integrated.fontSize": 14,
				"terminal.integrated.minimumContrastRatio": 7,
				"terminal.integrated.rightClickBehavior": "default",
				"terminal.integrated.tabs.enabled": true,
				"typescript.implementationsCodeLens.enabled": true,
				"typescript.inlayHints.enumMemberValues.enabled": true,
				"typescript.inlayHints.functionLikeReturnTypes.enabled": true,
				"typescript.inlayHints.parameterNames.enabled": "all",
				"typescript.inlayHints.parameterTypes.enabled": true,
				"typescript.inlayHints.propertyDeclarationTypes.enabled": true,
				"typescript.inlayHints.variableTypes.enabled": true,
				"typescript.referencesCodeLens.enabled": true,
				"typescript.referencesCodeLens.showOnAllFunctions": true,
				"vscode-kanata.includesAndWorkspaces": "workspace",
				"vscode-kanata.localKeysVariant": "deflocalkeys-wintercept",
				"window.commandCenter": true,
				"window.menuBarVisibility": "classic",
				"window.newWindowProfile": "Default",
				"window.openFilesInNewWindow": "off",
				"window.title": "${dirty}${activeEditorMedium}${separator}${rootName}${separator}${folderName}",
				"workbench.colorTheme": "Never be lost (Day)",
				"workbench.commandPalette.history": 10,
				"workbench.commandPalette.preserveInput": true,
				"workbench.editor.closeOnFileDelete": true,
				"workbench.editor.decorations.badges": true,
				"workbench.editor.revealIfOpen": true,
				"workbench.editor.showIcons": true,
				"workbench.editor.wrapTabs": true,
				"workbench.iconTheme": "material-icon-theme",
				"workbench.list.defaultFindMode": "filter",
				"workbench.list.smoothScrolling": true,
				"workbench.startupEditor": "welcomePage",
				"workbench.tree.indent": 15,
				"workbench.tree.renderIndentGuides": "always",
				"zenMode.restore": false,
				// EXTENSIONS SETTINGS
				"biome_lsp.trace.server": "verbose",
				"bookmarks.label.suggestion": "suggestWhenSelectedOrLineWhenNoSelected",
				"bookmarks.saveBookmarksInProject": true,
				"bookmarks.useWorkaroundForFormatters": true,
				/**==========================================================================
													 Comment Anchors
				===========================================================================*/
				"commentAnchors.showCursor": true,
				"commentAnchors.tags.anchors": {
					"ANCHOR": {
						"enabled": false,
						"scope": "workspace"
					},
					"BUG": {
						"backgroundColor": "#660000",
						"borderRadius": 5,
						"borderStyle": "1px dotted Transparent",
						"highlightColor": "Red",
						"iconColor": "#f00000",
						"isBold": true,
						"isItalic": false,
						"scope": "workspace"
					},
					"FIXME": {
						"backgroundColor": "#660000",
						"borderRadius": 5,
						"borderStyle": "1px dotted Transparent",
						"highlightColor": "Red",
						"iconColor": "#f00000",
						"isBold": true,
						"isItalic": false,
						"scope": "workspace"
					},
					"LINK": {
						"backgroundColor": "#003366",
						"behavior": "link",
						"borderRadius": 5,
						"borderStyle": "1px dotted Transparent",
						"highlightColor": "DeepSkyBlue",
						"iconColor": "#00bfff",
						"isBold": true,
						"isItalic": false,
						"scope": "workspace"
					},
					"NOTE": {
						"backgroundColor": "#000",
						"borderRadius": 5,
						"borderStyle": "1px dotted Transparent",
						"highlightColor": "White",
						"iconColor": "#FFF",
						"isBold": true,
						"isItalic": false,
						"scope": "workspace"
					},
					"REVIEW": {
						"backgroundColor": "#0a6600",
						"borderRadius": 5,
						"borderStyle": "1px dotted Transparent",
						"highlightColor": "Chartreuse",
						"iconColor": "#7af500",
						"isBold": true,
						"isItalic": false,
						"scope": "workspace"
					},
					"SECTION": {
						"backgroundColor": "#520066",
						"behavior": "region",
						"borderRadius": 5,
						"borderStyle": "1px dotted Transparent",
						"highlightColor": "Orchid",
						"iconColor": "#da70d6",
						"isBold": true,
						"isItalic": false,
						"scope": "workspace"
					},
					"STUB": {
						"enabled": false,
						"scope": "file"
					},
					"TODO": {
						"backgroundColor": "#636600",
						"borderRadius": 2,
						"borderStyle": "1px dotted Transparent",
						"highlightColor": "#ffea2e",
						"iconColor": "#ffea2e",
						"isBold": true,
						"isItalic": false,
						"scope": "workspace"
					},
					"ℹ": {
						"backgroundColor": "#002794",
						"borderRadius": 5,
						"borderStyle": "1px dotted Transparent",
						"highlightColor": "White",
						"iconColor": "#FFF",
						"isBold": true,
						"isItalic": true,
						"scope": "workspace",
						"styleMode": "comment"
					},
					"⚠": {
						"backgroundColor": "#7a3100",
						"borderRadius": 5,
						"borderStyle": "1px dotted Transparent",
						"highlightColor": "#ffea2e",
						"iconColor": "#f07800",
						"isBold": false,
						"isItalic": false,
						"scope": "workspace",
						"styleMode": "comment"
					},
					"❔": {
						"backgroundColor": "SlateBlue",
						"borderRadius": 5,
						"borderStyle": "1px dotted Transparent",
						"highlightColor": "White",
						"iconColor": "#6a5acd",
						"isBold": true,
						"isItalic": true,
						"scope": "workspace",
						"styleMode": "comment"
					},
					"🔖": {
						"borderRadius": 5,
						"borderStyle": "1px dotted Transparent",
						"highlightColor": "White",
						"iconColor": "#FFF",
						"isBold": true,
						"isItalic": true,
						"scope": "workspace",
						"styleMode": "comment"
					}
				},
				"commentAnchors.tags.matchPrefix": ["#", "#/", "*", "/*", "/**", "//", "<!--"],
				"commentAnchors.tags.matchSuffix": ["*/", "-->", "/#"],
				"commentAnchors.tags.separators": ["\t", " ", " - ", ": "],
				"indenticator.hover.peekBack": 5,
				"indenticator.hover.peekForward": 5,
				"indenticator.showHover": true,
				"indenticator.style": "solid",
				"markdown.preview.breaks": true,
				"markdownShortcuts.icons.citations": true,
				"markdownShortcuts.icons.image": true,
				"metaGo.decoration.additionalSingleCharCodeCharacters": "J,N,É,L,I,U,Y,H,B,M,P,V,G,T,R,F,C,D,E,X,S,Z,A,Q,W",
				"metaGo.decoration.backgroundColor": "#ff1493,#dc143c",
				"metaGo.decoration.backgroundOpacity": "1",
				"metaGo.decoration.borderColor": "#ffffff85",
				"metaGo.decoration.characters": "j, f, é, d, l, s, h, g, m, q, u, t, i, e, o, n, v, b, c, x, w, p, a, k",
				"metaGo.decoration.color": "yellow",
				"metaGo.decoration.useTextBasedDecorations": true,
				"metaGo.decoration.width": 12,
				"metaGo.jumper.enableRippleSupportForSequentialTargetCharsCommand": false,
				"metaGo.jumper.timeout": 120,
				"path-autocomplete.extensionOnImport": true,
				"path-autocomplete.triggerOutsideStrings": true,
				"prettier.arrowParens": "always",
				"prettier.bracketSameLine": false,
				"prettier.bracketSpacing": true,
				"prettier.embeddedLanguageFormatting": "auto",
				"prettier.endOfLine": "lf",
				"prettier.htmlWhitespaceSensitivity": "css",
				"prettier.insertPragma": false,
				"prettier.printWidth": 110,
				"prettier.proseWrap": "never",
				"prettier.quoteProps": "as-needed",
				"prettier.requirePragma": false,
				"prettier.semi": true,
				"prettier.singleAttributePerLine": true,
				"prettier.singleQuote": false,
				"prettier.tabWidth": 2,
				"prettier.trailingComma": "es5",
				"prettier.useTabs": true,
				"prettier.vueIndentScriptAndStyle": true,
				"relativePath.excludedExtensions": [],
				"relativePath.ignore": ["**/*.dll", "**/.git/**", "**/node_modules/**", "**/obj/**", "**/objd/**"],
				"shellformat.path": "/usr/local/bin/shfmt",
				"sort-json.settings.defaultCustomSort": "",
				"sort-json.settings.listSortType": "Value",
				"sort-json.settings.orderOverrideKeys": [
					"control",
					"description",
					"menu_alias",
					"menu_class",
					"menu_tip",
					"name",
					"package-name",
					"theme",
					"theme_uefi",
					"title",
					"type",
					"version"
				],
				"sort-json.settings.promptCollectionKeys": true,
				"sort-json.settings.sortMode": "Lists Only",
				// # EXTENSION: Surround
				"surround.custom": {
					"curly": {
						"description": "Surround with simple quotes",
						// label must be unique
						"label": "Curly bracket {}",
						"snippet": "{$TM_SELECTED_TEXT}$0" // <-- snippet goes here.
					},
					// command name must be unique
					"jsonParent": {
						"description": "Surround with Json Parent Object",
						// label must be unique
						"label": "Json Parent",
						"snippet": "\"${1:parent}\": {\n$TM_SELECTED_TEXT\n}$0" // <-- snippet goes here.
					},
					"literals": {
						"description": "Surround with Template literals",
						// label must be unique
						"label": "Template literals ` `",
						"snippet": "`$TM_SELECTED_TEXT`$0" // <-- snippet goes here.
					},
					"parenthesis": {
						"description": "Surround with simple quotes",
						// label must be unique
						"label": "parenthesis ()",
						"snippet": "($TM_SELECTED_TEXT)$0" // <-- snippet goes here.
					},
					"quotes": {
						"description": "Surround with double quotes",
						// label must be unique
						"label": "Quotes \" \"",
						"snippet": "\"$TM_SELECTED_TEXT\"$0" // <-- snippet goes here.
					},
					"square": {
						"description": "Surround with simple quotes",
						// label must be unique
						"label": "square bracket []",
						"snippet": "[$TM_SELECTED_TEXT]$0" // <-- snippet goes here.
					},
					"squotes": {
						"description": "Surround with simple quotes",
						// label must be unique
						"label": "Quotes ' '",
						"snippet": "'$TM_SELECTED_TEXT'$0" // <-- snippet goes here.
					}
				},
				"linesinfostatusbar.totalDisplayFormat": "Total %d",
				"zoombar.defaultZoom": 120,
				"zoombar.uiDisplayOrder": "-+%@"
			}
		}
	}
}

5. Switch to reading mode
6. Press Ctrl+Home and alternate with Ctrl+End multiple time. Do the same with others moving keys.

The more the code block is long, the more the scroll will stutter. Duplicate the above content in the same code block if no lag is noticed on your setup. Even worse if the note contains images and other text outside the block.

Expected behavior

Be as smooth and fast as when the plugin is disabled.

Screenshot

Only tested on

• [x] Windows
• [ ] macOS
• [ ] Linux
• [ ] Android
• [ ] iOS

Plugin version

0.4.5

Workaround

Don’t set language in your problematic code block.

```
👆 Long code block with no language set
will be ignored.
```

Other tests

• Starting Obsidian wiht --disable-smooth-scrolling will make this issue less obvious but using Ctrl+End <-> Ctrl+Home will still show it is way slower.
• Disable/Enable hardware acceleration in settings>appearence won’t change anything.