Everything about Google Translate crashing React (and other web apps)
1–10 of 88 posts
Re: Everything about Google Translate crashing React (and other web apps)
#2Last part of the post hints at a possible future for SPAs: wasm. No DOM modified by browser extensions so no surprise.
Re: Everything about Google Translate crashing React (and other web apps)
#3So the fundamental problem is the DOM is too inefficient to do applications on it. No surprise there, considering the original design of HTML was for presenting information, not for interactive applications.
Re: Everything about Google Translate crashing React (and other web apps)
#4Another solution would be a React-native machine translation implementation that updates the TextNodes without replacing them. It would still have the issues of merging adjacent nodes to get a proper translation, but at least it could update on any state change.
Re: Everything about Google Translate crashing React (and other web apps)
#5The substack.com is a typical example of a problem where the Google Translate extension can crash or cause parts to explode.
Re: Everything about Google Translate crashing React (and other web apps)
#6So the fundamental problem is the DOM is too inefficient to do applications on it. No surprise there, considering the original design of HTML was for presenting information, not for interactive applications.
That is not the case anymore.
React and many other SPA frameworks use an additional virtual DOM which gets mapped onto the real DOM. This used to be faster 10 years ago and allowed for a unified interface.
Any addon manipulating the DOM forces the virtual DOM to go out of sync thus crashing the app.
As shown be the likes of Svelte, the virtual DOM is just legacy modern browsers are fast enough to get by without.
Re: Everything about Google Translate crashing React (and other web apps)
#7So the fundamental problem is the DOM is too inefficient to do applications on it. No surprise there, considering the original design of HTML was for presenting information, not for interactive applications.
I doubt it. Say you write a native app and some other side app swoops in and changes all your UI state while running. That is going to cause problems.
Re: Everything about Google Translate crashing React (and other web apps)
#8> When I first ran into this issue back in 2017, I posted in the React issue tracker that I had ”fixed” my app by blocking translation entirely.
Please do not do this! In almost every instance I've encountered severe Translate-related broken-ness, it's still worked well enough to get me a snapshot of the current page translated. Fighting through this is still less cumbersome than the alternatives.
> The only alternative solution that I can think of, is to implement your own localization within your app (i.e. internationalization)
I will add, please make sure that language is an independent setting, and not derived from locale! I sometimes have to use translate on sites that have my preferred language available, but won't show it to me because it's tied to locale and that changes other things that I don't want, like currency.
On one such site I used a browser extension to rewrite the request for the language strings file.
Re: Everything about Google Translate crashing React (and other web apps)
#9So the fundamental problem is the DOM is too inefficient to do applications on it. No surprise there, considering the original design of HTML was for presenting information, not for interactive applications.
I think the fundamental problem is you have two applications, the primary application and google translate altering the application state of the primary application at the same time, without any possible communication between the two regarding locking or alterations or anything.
I'm pretty sure most applications in the history of computing would not fare any better if you constructed that situation.
Re: Everything about Google Translate crashing React (and other web apps)
#10So the fundamental problem is the DOM is too inefficient to do applications on it. No surprise there, considering the original design of HTML was for presenting information, not for interactive applications.
I think the fundamental problem is you have two applications, the primary application and google translate altering the application state of the primary application at the same time, without any possible communication between the two regarding locking or alterations or anything. I'm pretty sure most applications in the history of computing would not fare any better if you constructed that situation.
Both Google and React are guilty here if i read the article right.
Google replaces an element with a different element (Text with Font containing Text?), and React's virtual DOM keeps the old, deleted elements alive because the virtual DOM still references them.
React "applications" would crash when Google Translate changes their stuff from under them if they didn't accidentally keep the old elements alive. Which would be much better behaviour.