[Reader] Flashing images when turning pages (Firefox)

Dex-chan lover
Joined
Aug 16, 2020
Messages
86
As the title states, whenever I use Firefox on MangaDex and switch pages it flickers/flashes the new page momentarily, which is very distracting.
This is quite an issue for me, as if I'm reading a chapter with little text I would naturally click through the pages very quickly, which makes me feel very nauseated and dizzy, due to the constant flashing.

Strangely enough, if I view all of the pages in the chapter before going back to the first page to read the chapter properly, it doesn't occur (just like in Chrome).
 
no way
Staff
Super Moderator
Joined
Jan 22, 2018
Messages
882
Was able to replicate this,

Firefox 133.0 (aarch64)
macOS 15.1.1 (24B91)
MacBook Air M2
 
୧⍢⃝୨
Staff
Super Moderator
Joined
Jan 7, 2023
Messages
280
Hi @kouyo do you have an update regarding this?
The issue ticket it's still open on our issue tracker, some suggestions have been made but not final fix implementation yet has been decided. Someone internally created an userscript that solves the issue, but it has some disadvantages like increased memory and CPU consumption.
 
Last edited:
Dex-chan lover
Joined
Aug 16, 2020
Messages
86
The issue ticket it's still open on our issue tracker, some suggestions have been made but not final fix implementation yet has been decided. Someone internally created an userscript that solves the issue, but it has some disadvantages like increased memory and CPU consumption.
Hi @kouyo , has there been any progress regarding the issue, as I'm planning to move to Firefox soon (as chrome is just getting worse) and don't want to experience the constant flashing images when turning to a new page?
Even a temporary workaround would be helpful (I may use chrome just for MangaDex, as another temporary solution).

You mentioned an issue tracker.
Is this issue tracker open to the public, as it may be more convenient if I check the issue tracker instead of repeatedly asking you questions about the bug, or is it only for MangaDex staff? No worries if its private only!

Thank you!
 
୧⍢⃝୨
Staff
Super Moderator
Joined
Jan 7, 2023
Messages
280
Hi @kouyo , has there been any progress regarding the issue, as I'm planning to move to Firefox soon (as chrome is just getting worse) and don't want to experience the constant flashing images when turning to a new page?
Unfortunately, I don't have an update on this issue, but it's still being worked on. Our reader is one of the most complicated piece of software and it's quite difficult to tinker with it.
Even a temporary workaround would be helpful (I may use chrome just for MangaDex, as another temporary solution).
As for a temporary workaround, I'll ask around if it's ok to share the script someone created internally. Otherwise, using Chrome will be the only solution.
Is this issue tracker open to the public, as it may be more convenient if I check the issue tracker instead of repeatedly asking you questions about the bug, or is it only for MangaDex staff?
Our issue tracker is currently only accessible to certain staff members, we have plans to make it public (not anytime soon, alas), but for now you will have to rely on staff members to provide updates. Don't worry, I'll post any updates as soon as there are any.
 
Dex-chan lover
Joined
Aug 16, 2020
Messages
86
I have tried reading Mangadex using Firefox without any extensions as well as without hardware acceleration, but unfortunately it doesn't change the outcome.

I'm on Windows not MacOS, so no I'm definitely not using the thing you linked.

mod note: reply edited, user was replying to a spam bot, presumably
 
Last edited by a moderator:
୧⍢⃝୨
Staff
Super Moderator
Joined
Jan 7, 2023
Messages
280
Hi, I forgot to update this thread, sorry.
I asked the developers, but unfortunately I can't share the script because of the way it changes how the reader behaves. If this bothers you, try using a Chromium browser instead. I was told that this can be fixed however, but it's not a trivial fix.
 
File Attacher
Staff
Super Moderator
Joined
Jan 20, 2018
Messages
310
Remembered my own userscript (not the one mentioned previously) I started some time ago, was incomplete so fixed up a few bits and seems to work decently, on my end at least, not sure if I overlooked anything since I didn't test it that extensively, not to mention that I'm a chrome user :nyoron:

(and hopefully nothing messed up by trying to post this from my phone)
JavaScript:
// ==UserScript==
// @name        FF Flicker Fix
// @namespace   idkjustpicksomethingrandom
// @match       https://mangadex.org/*
// @match       https://canary.mangadex.dev/*
// @version     v0.42
// @author      Ndtm
// @icon        https://www.google.com/s2/favicons?domain=mangadex.org
// @run-at      document-body
// @grant       none
// ==/UserScript==
(function(){
  'use strict';

  const useDecodingProperty = false; //Whether to set the .decoding property to 'sync' instead of calling the .decode() function on the images
  //which imo should be set to true since for me that's what works best

  HTMLElement.prototype.waitOnMini = function(sel){
        return new Promise((resolve,reject) => {
            const queryFunc = this.querySelector.bind(this);
            let testQuery = queryFunc(sel);
            if(testQuery!==null) return resolve(testQuery);
            let observer = new MutationObserver((mutations)=>{
                for(const mutation of mutations){
                    if(mutation.type === "childList" && mutation.addedNodes){
                        let query = queryFunc(sel);
                        if(query!==null){
                            observer.disconnect();
                            resolve(query);
                        }
                    }
                }
            });
            observer.observe(this,{childList:true, subtree:true});
        });
    }
  let contentObserver;
  let chapterObserver;
  let readerObserver;
  function checkforchapter(url,initial = false){
    if (initial || url.pathname.startsWith('/chapter') && !(currentUrl !== '' && url.pathname.startsWith(currentUrl)) && (!/\/(?:edit|pages)$/.test(url.pathname))){
      currentUrl = location.pathname.match(/\/chapter\/[^\/]+/)?.[0] || '';
      document.body.waitOnMini('.md--reader-chapter').then(chapDiv => {
        if(chapterObserver) chapterObserver.disconnect();
        chapterObserver = new MutationObserver(chapmutations => {
          for(const mutation of chapmutations){
            if(mutation.type === "childList" && mutation.addedNodes){
              Array.from(mutation.addedNodes).forEach(chapadded => {
                if(chapadded.classList?.contains('md--reader-pages') && !chapadded.children[0].classList.contains('placeholder')){
                  chapadded.waitOnMini('.md--page').then(reader => {
                    if(readerObserver) readerObserver.disconnect();
                    readerObserver = new MutationObserver((mutations)=>{
                      for(const mutation of mutations){
                        if(mutation.type === "childList" && mutation.addedNodes){
                          Array.from(mutation.addedNodes).forEach(elem => {if(elem.nodeName === 'IMG'){useDecodingProperty ? elem.decoding = 'sync' : elem.decode()}});
                        }
                      }
                    })
                    console.log('creating reader observer')
                    readerObserver.observe(reader,{childList:true, subtree:false});
                  })
                }
              })
            }
          }
        })
        chapterObserver.observe(chapDiv,{childList:true, subtree:false});
        console.log('creating chapter observer')
      })
    }
  }
  let currentUrl = location.pathname.match(/\/chapter\/[^\/]+/)?.[0] || '';
  document.body.waitOnMini('.md-content').then(contElem => {
    if(contentObserver) contentObserver.disconnect();
    contentObserver = new MutationObserver((mutations)=>{
      for(const mutation of mutations){
        if(mutation.type === "childList" && mutation.addedNodes){
          Array.from(mutation.addedNodes).forEach(elem => {
            if(elem.nodeName === 'DIV' && /reader/.test(elem.className)){ checkforchapter(new URL(location)) }}
          );
        }
      }
    })
    console.log('creating content observer')
    contentObserver.observe(contElem,{childList:true, subtree:false})
  });
  if (currentUrl.startsWith('/chapter') && (!currentUrl.endsWith('/edit') || !currentUrl.endsWith('/pages'))) checkforchapter(null, true)
})();
 
Dex-chan lover
Joined
Aug 16, 2020
Messages
86
Remembered my own userscript (not the one mentioned previously) I started some time ago, was incomplete so fixed up a few bits and seems to work decently, on my end at least, not sure if I overlooked anything since I didn't test it that extensively, not to mention that I'm a chrome user :nyoron:

(and hopefully nothing messed up by trying to post this from my phone)

Hi @Ndtm ,

Thank you for your support!

I wanted to ask, do I just copy & paste the script into Violent Monkey and hit save, or do I need to do something else? As even when I change the "useDecodingProperty = false" part to "useDecodingProperty = true" nothing changes.

The extension says the script is running on MD, but honestly the problem is probably just how I screwed up configuring things.


 
File Attacher
Staff
Super Moderator
Joined
Jan 20, 2018
Messages
310
Hi @Ndtm ,

Thank you for your support!

I wanted to ask, do I just copy & paste the script into Violent Monkey and hit save, or do I need to do something else? As even when I change the "useDecodingProperty = false" part to "useDecodingProperty = true" nothing changes.

The extension says the script is running on MD, but honestly the problem is probably just how I screwed up configuring things.


Did you reload the tab? Optionally you could check and see if you can see if it is logging to the console in the devtools "creating ... Observer"
 
Dex-chan lover
Joined
Aug 16, 2020
Messages
86
Did you reload the tab? Optionally you could check and see if you can see if it is logging to the console in the devtools "creating ... Observer"
Yes I reloaded the tab.

If you mean Hamburger Menu > More Tools > Browser Console > Enable Multiprocess. Then I get this:

Code:
00:26:15.259 [Violentmonkey][FF Flicker Fix] SyntaxError: missing ) in parenthetical
    Le moz-extension://ee9f2748-1b45-4226-a631-5fe50f9153c6/sandbox/injected-web.js:1
    post moz-extension://ee9f2748-1b45-4226-a631-5fe50f9153c6/sandbox/injected-web.js:1
    ScriptData moz-extension://ee9f2748-1b45-4226-a631-5fe50f9153c6/sandbox/injected-web.js:1
    onHandle moz-extension://ee9f2748-1b45-4226-a631-5fe50f9153c6/sandbox/injected-web.js:1
    je moz-extension://ee9f2748-1b45-4226-a631-5fe50f9153c6/sandbox/injected-web.js:1
injected.js:1:683
00:26:15.362 Session token expired... attempting silent refresh. entry.oh6yYiVs.js:2:25719
00:26:15.730 Could not use silent refresh of access token (ErrorResponse: Token is not active). entry.oh6yYiVs.js:2:25984
00:26:15.765 [UserPreferences] Theme change from 'undefined' to 'dark'. mchunk-pg-author-_id_.9TFdH9pp.js:7:4259
00:26:15.765 [UserPreferences] Theme 'dark' applied. mchunk-pg-author-_id_.9TFdH9pp.js:7:4259
00:26:15.833 [FeatureFlags] Initialized feature flags (17ms)
Object { defaultsApplication: Proxy, overridesLocal: Proxy, defaultsServer: Proxy }
mchunk-pg-chapter-_id_.BdxLiNkn.js:1:1906
00:26:15.957 Content-Security-Policy warnings 4
00:26:15.977 [SupBan] Not displaying support banner to guests. mchunk-pg-chapter-_id_.BdxLiNkn.js:1:26970
00:26:15.999 Partitioned cookie or storage access was provided to “https://www.google.com/recaptcha/api2/anchor?ar=1&k=6LflOrIaAAAAACcpRSiKQlt_X6bq-QcVjHTG1diJ&co=aHR0cHM6Ly9tYW5nYWRleC5vcmc6NDQz&hl=en&v=GUGrl5YkSwqiWrzO3ShIKDlu&size=invisible&cb=48i438gytjo1” because it is loaded in the third-party context and dynamic state partitioning is enabled. injected.js:1:13619
00:26:16.058 Ignoring unsupported entryTypes: longtask. recaptcha__en.js:405:341
00:26:16.278 [Announcements] Fetching announcements... mchunk-pg-chapter-_id_.BdxLiNkn.js:1:17863
00:26:16.340 [GenericDebug] Config at time of start:
Object { readStyle: 1, headerStyle: 0, _viewStyle: 0, _limitWidth: false, _limitHeight: true, _scrollLock: {…}, _longStripMargin: 4, maxWidth: -1, maxHeight: -1, limitMaxWidth: false, … }
entry.oh6yYiVs.js:2:28660
00:26:16.351 [Announcements] Fetched announcements (1ms) mchunk-pg-chapter-_id_.BdxLiNkn.js:1:17863
00:26:16.647 [Reader Store] Marking C:dff1f666-63c7-4387-b92e-30dcba7d1cdc read mchunk-pg-chapter-_id_.BdxLiNkn.js:1:32297
00:26:16.653 [Reader Store] Fetching aggregate for dff1f666-63c7-4387-b92e-30dcba7d1cdc . Groups:
Array [ "bf541cf8-0f42-41a5-9805-315da5e6f0da" ]
mchunk-pg-chapter-_id_.BdxLiNkn.js:1:32297
00:26:16.654 [Reader Cache] Aggregate cache miss, fetching: 
Array [ "bf541cf8-0f42-41a5-9805-315da5e6f0da" ]
mchunk-pg-chapter-_id_.BdxLiNkn.js:1:27301
00:26:16.745 [Reader Page Manager] Server loaded with  240000 ms left mchunk-pg-chapter-_id_.BdxLiNkn.js:1:20342
00:26:16.745 [Reader Page Manager] Load from origin:
Object { initial: true, retry: false }
mchunk-pg-chapter-_id_.BdxLiNkn.js:1:20342
00:26:17.951 [GenericDebug] Swapping currently featured title to index 0... entry.oh6yYiVs.js:2:28660
00:26:18.076 Cookie warnings 5
00:26:22.837 WindowsJumpLists: Failed to fetch favicon for  https://mangadex.org/chapter/dff1f666-63c7-4387-b92e-30dcba7d1cdc/2 NS_ERROR_FAILURE: WindowsJumpLists.sys.mjs:257:29
00:26:22.839 WindowsJumpLists: Failed to fetch favicon for  https://mangadex.org/chapter/dff1f666-63c7-4387-b92e-30dcba7d1cdc/3 NS_ERROR_FAILURE: WindowsJumpLists.sys.mjs:257:29
00:26:22.843 WindowsJumpLists: Failed to fetch favicon for  https://mangadex.org/chapter/dff1f666-63c7-4387-b92e-30dcba7d1cdc/1 NS_ERROR_FAILURE: WindowsJumpLists.sys.mjs:257:29
00:26:28.033 [GenericDebug] Swapping currently featured title to index 2... entry.oh6yYiVs.js:2:28660
00:26:32.111 [Reader Store] Jumping to page G:1 mchunk-pg-chapter-_id_.BdxLiNkn.js:1:32297
00:26:33.813 [Reader Store] Jumping to page G:2 mchunk-pg-chapter-_id_.BdxLiNkn.js:1:32297
00:26:35.605 [Reader Store] Jumping to page G:1 mchunk-pg-chapter-_id_.BdxLiNkn.js:1:32297
00:26:36.397 [Reader Store] Jumping to page G:2 mchunk-pg-chapter-_id_.BdxLiNkn.js:1:32297
00:26:37.158 [Reader Store] Jumping to page G:3 mchunk-pg-chapter-_id_.BdxLiNkn.js:1:32297
00:26:38.135 [GenericDebug] Swapping currently featured title to index 0... entry.oh6yYiVs.js:2:28660
00:26:48.301 [GenericDebug] Swapping currently featured title to index 3... entry.oh6yYiVs.js:2:28660
00:26:58.461 [GenericDebug] Swapping currently featured title to index 2... entry.oh6yYiVs.js:2:28660
00:27:08.651 [GenericDebug] Swapping currently featured title to index 0... entry.oh6yYiVs.js:2:28660
00:27:18.861 [GenericDebug] Swapping currently featured title to index 2... entry.oh6yYiVs.js:2:28660

Sorry about formatting.
 
File Attacher
Staff
Super Moderator
Joined
Jan 20, 2018
Messages
310
Yes I reloaded the tab.

If you mean Hamburger Menu > More Tools > Browser Console > Enable Multiprocess. Then I get this:

Code:
00:26:15.259 [Violentmonkey][FF Flicker Fix] SyntaxError: missing ) in parenthetical
    Le moz-extension://ee9f2748-1b45-4226-a631-5fe50f9153c6/sandbox/injected-web.js:1
    post moz-extension://ee9f2748-1b45-4226-a631-5fe50f9153c6/sandbox/injected-web.js:1
    ScriptData moz-extension://ee9f2748-1b45-4226-a631-5fe50f9153c6/sandbox/injected-web.js:1
    onHandle moz-extension://ee9f2748-1b45-4226-a631-5fe50f9153c6/sandbox/injected-web.js:1
    je moz-extension://ee9f2748-1b45-4226-a631-5fe50f9153c6/sandbox/injected-web.js:1
injected.js:1:683
00:26:15.362 Session token expired... attempting silent refresh. entry.oh6yYiVs.js:2:25719
00:26:15.730 Could not use silent refresh of access token (ErrorResponse: Token is not active). entry.oh6yYiVs.js:2:25984
00:26:15.765 [UserPreferences] Theme change from 'undefined' to 'dark'. mchunk-pg-author-_id_.9TFdH9pp.js:7:4259
00:26:15.765 [UserPreferences] Theme 'dark' applied. mchunk-pg-author-_id_.9TFdH9pp.js:7:4259
00:26:15.833 [FeatureFlags] Initialized feature flags (17ms)
Object { defaultsApplication: Proxy, overridesLocal: Proxy, defaultsServer: Proxy }
mchunk-pg-chapter-_id_.BdxLiNkn.js:1:1906
00:26:15.957 Content-Security-Policy warnings 4
00:26:15.977 [SupBan] Not displaying support banner to guests. mchunk-pg-chapter-_id_.BdxLiNkn.js:1:26970
00:26:15.999 Partitioned cookie or storage access was provided to “https://www.google.com/recaptcha/api2/anchor?ar=1&k=6LflOrIaAAAAACcpRSiKQlt_X6bq-QcVjHTG1diJ&co=aHR0cHM6Ly9tYW5nYWRleC5vcmc6NDQz&hl=en&v=GUGrl5YkSwqiWrzO3ShIKDlu&size=invisible&cb=48i438gytjo1” because it is loaded in the third-party context and dynamic state partitioning is enabled. injected.js:1:13619
00:26:16.058 Ignoring unsupported entryTypes: longtask. recaptcha__en.js:405:341
00:26:16.278 [Announcements] Fetching announcements... mchunk-pg-chapter-_id_.BdxLiNkn.js:1:17863
00:26:16.340 [GenericDebug] Config at time of start:
Object { readStyle: 1, headerStyle: 0, _viewStyle: 0, _limitWidth: false, _limitHeight: true, _scrollLock: {…}, _longStripMargin: 4, maxWidth: -1, maxHeight: -1, limitMaxWidth: false, … }
entry.oh6yYiVs.js:2:28660
00:26:16.351 [Announcements] Fetched announcements (1ms) mchunk-pg-chapter-_id_.BdxLiNkn.js:1:17863
00:26:16.647 [Reader Store] Marking C:dff1f666-63c7-4387-b92e-30dcba7d1cdc read mchunk-pg-chapter-_id_.BdxLiNkn.js:1:32297
00:26:16.653 [Reader Store] Fetching aggregate for dff1f666-63c7-4387-b92e-30dcba7d1cdc . Groups:
Array [ "bf541cf8-0f42-41a5-9805-315da5e6f0da" ]
mchunk-pg-chapter-_id_.BdxLiNkn.js:1:32297
00:26:16.654 [Reader Cache] Aggregate cache miss, fetching:
Array [ "bf541cf8-0f42-41a5-9805-315da5e6f0da" ]
mchunk-pg-chapter-_id_.BdxLiNkn.js:1:27301
00:26:16.745 [Reader Page Manager] Server loaded with  240000 ms left mchunk-pg-chapter-_id_.BdxLiNkn.js:1:20342
00:26:16.745 [Reader Page Manager] Load from origin:
Object { initial: true, retry: false }
mchunk-pg-chapter-_id_.BdxLiNkn.js:1:20342
00:26:17.951 [GenericDebug] Swapping currently featured title to index 0... entry.oh6yYiVs.js:2:28660
00:26:18.076 Cookie warnings 5
00:26:22.837 WindowsJumpLists: Failed to fetch favicon for  https://mangadex.org/chapter/dff1f666-63c7-4387-b92e-30dcba7d1cdc/2 NS_ERROR_FAILURE: WindowsJumpLists.sys.mjs:257:29
00:26:22.839 WindowsJumpLists: Failed to fetch favicon for  https://mangadex.org/chapter/dff1f666-63c7-4387-b92e-30dcba7d1cdc/3 NS_ERROR_FAILURE: WindowsJumpLists.sys.mjs:257:29
00:26:22.843 WindowsJumpLists: Failed to fetch favicon for  https://mangadex.org/chapter/dff1f666-63c7-4387-b92e-30dcba7d1cdc/1 NS_ERROR_FAILURE: WindowsJumpLists.sys.mjs:257:29
00:26:28.033 [GenericDebug] Swapping currently featured title to index 2... entry.oh6yYiVs.js:2:28660
00:26:32.111 [Reader Store] Jumping to page G:1 mchunk-pg-chapter-_id_.BdxLiNkn.js:1:32297
00:26:33.813 [Reader Store] Jumping to page G:2 mchunk-pg-chapter-_id_.BdxLiNkn.js:1:32297
00:26:35.605 [Reader Store] Jumping to page G:1 mchunk-pg-chapter-_id_.BdxLiNkn.js:1:32297
00:26:36.397 [Reader Store] Jumping to page G:2 mchunk-pg-chapter-_id_.BdxLiNkn.js:1:32297
00:26:37.158 [Reader Store] Jumping to page G:3 mchunk-pg-chapter-_id_.BdxLiNkn.js:1:32297
00:26:38.135 [GenericDebug] Swapping currently featured title to index 0... entry.oh6yYiVs.js:2:28660
00:26:48.301 [GenericDebug] Swapping currently featured title to index 3... entry.oh6yYiVs.js:2:28660
00:26:58.461 [GenericDebug] Swapping currently featured title to index 2... entry.oh6yYiVs.js:2:28660
00:27:08.651 [GenericDebug] Swapping currently featured title to index 0... entry.oh6yYiVs.js:2:28660
00:27:18.861 [GenericDebug] Swapping currently featured title to index 2... entry.oh6yYiVs.js:2:28660

Sorry about formatting.
Wild stuff.. How do I keep running into weird things whenever I share a script... Never seen that error... And I even double checked in my Linux vm on the FF there..

Alright, a while later.. Finally managed to produce the same error by removing(commenting out) the last line of the script })(); .. So.. I guess, double check that you copied the entirety of the script? Should be 88 lines long
 
Dex-chan lover
Joined
Aug 16, 2020
Messages
86
Wild stuff.. How do I keep running into weird things whenever I share a script... Never seen that error... And I even double checked in my Linux vm on the FF there..

Alright, a while later.. Finally managed to produce the same error by removing(commenting out) the last line of the script })(); .. So.. I guess, double check that you copied the entirety of the script? Should be 88 lines long
Yeah I just confirm that the last line was missing and it works now, thank you very much!
I must have missed it when highlighting the code comment earlier.
 

Users who are viewing this thread

Top