DOM German Translator

This is a Tampermonkey userscript that translates web content into German while preserving the integrity of Single Page Applications (SPA) like React, Vue, and Angular

Features

• Preserves HTML: Walks the DOM tree and only touches raw text.
• React-Safe: Does not trigger "checksum" errors or break event listeners.
• Infinite Scroll Support: Automatically detects and translates new content while scrolling.
• Toggleable: Switch between original and translated text instantly with a hotkey.
• Fast Execution: Parallel requests to the Google Translate API for quick results.
• Caching: Remembers translated phrases to save bandwidth and speed up repeat views.
• Smart Filtering: Automatically ignores code blocks, scripts, styles, and input fields.
• Cleanup: Restores the original text when toggled off.

Installation

1. Install the Tampermonkey browser extension.
2. Click Create a new script.
3. Paste the contents of translate.user.js.
4. Save (Ctrl+S).

Usage

1. Install: Copy the script into Tampermonkey.
2. Activate: Press ALT + D on any website to toggle the translation.
3. Monitor: Check the browser console (F12) to see how many elements are being processed.

Technical Stuff

• API: Uses the Google Translate gtx endpoint.
• Observer: Uses MutationObserver with a 700ms debounce to handle dynamic content loading.
• Traversal: Uses document.createTreeWalker to isolate Node.TEXT_NODE elements, ensuring no HTML tags are overwritten.