-
Please update the transcript search feature to be more efficient. Chrome slows to a crawl right when you click into the search field and freezes for 1-3 minutes before giving a result.
-
-
Hello CXL.
are you running into the same issue on https://foliovision.com/player/demos/interactive-transcript ?
If not, then please post the URL to your page where we can see the issue.
Thanks,
Martin
The issue occurs on any fv player on our site. Can see on public facing videos here: https://conversionxl.com/show
You should have access to our staging env. To see the issue behind our pay wall.
I have attached a gif showing the issue. I am typing in the search box soon after my first click into the field. I can’t see my search result, chrome starts to lag, nothing appears. Sometimes the result will start to highlight in the transcript window, but it’s slow and doesn’t show what I typed in search. Also, after clicking autoplay checkbox as you see in the gif. Each time I type (even after clicking back in the search box) it affects the checkbox.
Hello CXL,
I checked the issue and I can see that the text which you type into the transcript box is there, but it’s white, so it can’t be seen. So we will put up some CSS for the input text color.
I checked that performance issue as well – it appears that the search phrase highlight (using https://github.com/julmot/mark.js) gets into some issue with the MutationObserver added by the rocket-lazy-load plugin. Could you please disable that one and see if that help?
The autoscroll checkbox gets unchecked on purpose – when you are doing a search you surely don’t want the transcript box to follow the video playback position as you want to actually look at the matches.
Thanks,
Martin
I see Lazy Load by WP Rocket. It’s been disabled. Don’t see it as being enabled during your last visit.
Could it be the EWW image optimizer that’s causing the issue?
Hello CXL,
please just load your page with the transcript in Chrome and play the video. Then start recording in the performance tab and type in some seach keyword for transcript. As you said it will take a while to execute. Then stop the recording and you should have a trace of the JavaScript code executed which will point you in the right direction.
I would like to solve the issue with LazyLoad by WP Rocket as we use that one some websites too.
Thanks,
Martin
I have ran the test and provided a screenshot. I have saved the profile if this would be helpful.
Hello CXL,
when I use the transcript search on https://conversionxl.com/show/saying-no-for-growth/ I’m not noticing a huge lag in the highlight. I typed in “story” and then added “telling” to it and it was all running quickly.
I’m attaching a screenshot of the Performance tab, it shows the amount of processing required when I typed in “a” into the transcript search box. There were a lot of occurrences of that, so it might be the slowest highlight on there. And it was still done in 62 ms – that’s the c.fn.unmark part of it. You can see two (index):1320 calls too which took much longer – that’s the MutationObserver added by the rocket-lazy-load plugin.
It’s nowhere as slow as what’s on your screenshot: https://foliovision.com/images/2019/03/chrome_2019-03-05_15-15-22.png Please try again with your browser extensions disabled, perhaps an incognito window will help too.
However I’m not sure how we can do any highlight without modifying the HTML content of that textarea and thus not getting caught by that MutationObserver.
Perhaps the fix here is to require the search keyword to be at least 3 characters.
Going back to your screenshot – it doesn’t show any excessive processing for that MutationObserver added by the rocket-lazy-load plugin. I think you said you disabled that one for a test.
So I wonder what makes mark.js so slow on your computer.
Please try on https://foliovision.com/player/demos/interactive-transcript-chapters as well.
Thanks,
Martin
Interesting.
The issue doesn’t occur on the foliovision demo page on either one of my PCs and my macbook with the same exact chrome set up and extensions (use chrome browser sync).
The issue does occur on all of those devices when viewing with the institute. I will check my browser. However, our students and other team members have experienced the same issue with different devices and browsers. This occurs on and off our local network as well.
Hello CLX,
as I said already – we can just require at least 2 or 3 characters to be entered before the hilight kicks in and that should help a lot already.
Thanks,
Martin
Hello Martin,
That’s perfect. We look forward to the update. Thank you!
Hello CXL,
FV Player Pro Beta 7.3.13.727 is out and it improves the transcript search hilight speed a lot. The input was not properly debounced until now.
Thanks,
Martin
