Re:Google Docs will now use canvas based rendering
by nailer on Wednesday May 12, 2021 @12:21PM
(#27132059)
> The APIs for text manipulation in the DOM are abysmal
I develop an NLP labelling interface (which is similarly document-focused) in JS all day and can attest to this.
Here's some specific examples:
- To work out where some text is being being laid out, eg to display some UI around it, the Selection/Range/Rect APIs will help but Rects are always viewport-relative, so you'll need to convert them to element-relative to position your UI, which sucks.
- Firefox supports multiple DOM Ranges per Selection (ie allows non continguous text selection), but nearly all other browsers support a single range.
- You can't truncate text across multiple lines (the CSS line clamp spec is an experimental fix)
- If you want to pop up an interface while some text is selected, you'll need to capture and reimplement selection because as soon as another item is focused the selection will no longer display.
I develop an NLP labelling interface (which is similarly document-focused) in JS all day and can attest to this.
Here's some specific examples:
- To work out where some text is being being laid out, eg to display some UI around it, the Selection/Range/Rect APIs will help but Rects are always viewport-relative, so you'll need to convert them to element-relative to position your UI, which sucks.
- Firefox supports multiple DOM Ranges per Selection (ie allows non continguous text selection), but nearly all other browsers support a single range.
- You can't truncate text across multiple lines (the CSS line clamp spec is an experimental fix)
- If you want to pop up an interface while some text is selected, you'll need to capture and reimplement selection because as soon as another item is focused the selection will no longer display.
If you're into JS and building anything document related, I've written a bunch about the some of the issues at https://humanloop.com/blog/how-to-build-an-ml-labelling-inte...