search

recogito / recogito-js

A JavaScript library for text annotation
BSD 3-Clause "New" or "Revised" License
359 stars 42 forks source link

Lazy loading #20

Open rsimon opened 3 years ago

rsimon commented 3 years ago

One of the major limitations of the original code: all annotations are rendered at load-time. Heavily annotated pages (2000+ annotations) have been causing problems. This lib could be an opportunity to implement lazy loading right from the start.

(Migrated from https://github.com/pelagios/recogito-text-js/issues/3)

Apeli commented 2 years ago

@rsimon Do you happen to remember what kind of issues happened on heavily annotated pages? We're running into issues that somehow seem to relate to memory issues. Some users report that the annotator stops working in the middle of a document and even reloading the page doesn't help, some documents have very messed up indexes etc.

rsimon commented 2 years ago

No, that doesn't sound like it's a problem with the number of annotations. RecogitoJS should be good up to 2.000 per page or so. After that, things just start to get slow. Loading takes a long time (>10s or more, depending on how many annotations there are). And selecting an existing annotation, or hitting 'OK' in the editor will freeze for a while.

In the extreme case, the page gets stuck and the browser might be displaying that generic "JavaScript is blocking the page do you want to stop or wait" warning.

rsimon commented 2 years ago

Messed up indices, by the way, sound like they might be a race condition problem with dynamically loading pages. (If some of the content takes a longer time to load than the annotations.) But just a guess - hard to tell without seeing real examples & potential error messages (if there are any...)

Apeli commented 2 years ago

Thanks for the info @rsimon. In our case the culprit for the messed up indices was probably our formatter. We attached hover/blur events for the annotation, and those showed a "hovering tooltip" -type of annotation when users bring their pointer over the annotation. The tooltip was rendered & destroyed with js. It worked fine in 99.5% of situations but there was a small possibility where the blur-event / destroying didn't work, which left tooltips in the source -> messed up indexes. We changed the tooltips to appear with pure css, that way there shouldn't be even the tiniest possibility for the annotator to contaminate the document body.

rsimon commented 2 years ago

Ah, yes that will definitely explain it. CSS sounds like a good solution. Otherwise, you could also attach the tooltip to the document body directly, I guess, with absolute positioning. (Or, at least, somewhere outside the annotatable content element.)