Filter loading lag

[nsfw-filter]

Filter loading lag

[yzevm]

we didn't , I just put everything in a single loop, its lazy loading behaviour, if you just mark as checked not loading content, user can see nsfw images in next scrolls
will check in 12hr

[yzevm]

Yeah. I'll fix it today
sure
accepted

[yzevm]

Difficult bug, lets fix it in the next releases, removed from v1.0.0

[pottekkat]

We are getting some coverage on social media. And this lag could be a turn off for some of the users. Although it may work on things like social media sites where NSFW images may occur not that frequently. But the users test them on Google Images and sites like that and although the extension works, the initial lag may be an issue. It could defy the purpose of the extension.

Link: https://www.appinn.com/nsfw-filter/
PS: This article was translated from Chinese?

[yzevm]

Related solution:

• https://stackoverflow.com/a/43245774/10432429

Moved to v1.1.0 project

ps. chinese article? dude your marketing skill is awesome 👍

[yzevm]

What will we change, document.readyState? before the EventListner?

Dunno yet, just possible solution

[pottekkat]

@YegorZaremba There seems to be a small lag from when the pages are loaded and the images are hidden. Can we fix this?
@yxlin118 is currently looking for a solution to this.
@YegorZaremba Please check in on this.

[yzevm]

Hi, thanks for contributing, so yeah its issue that I tried to solve, thought that document.addEventListener("DOMContentLoaded", func); will fix it, cause we used(and still use) window load event, but same behaviour. Please share If you find sth related to solution. I hope I will fix it in next release

[yxlin118]

@YegorZaremba Hi Yegor thanks for following up! What do you mean by document.addEventListener("DOMContentLoaded", func); will fix it but stil lthe same behavior?

[yzevm]

We subscribe on event to know when page is load, there are to events for our case
DOMContentLoaded – the browser fully loaded HTML, and the DOM tree is built, but external resources like pictures and stylesheets may be not yet loaded.
load – not only HTML is loaded, but also all the external resources: images, styles etc.

Not sure, looks like first task is load page, then work with extensions, maybe sth to force task into eventloop is helps, setImmediate or etc, needs time to figure out

[yxlin118]

I see. I can look into that. Do you have any useful documentation that you would recommend me to look into?

[pottekkat]

@all-contributors please add @yxlin118 for bug, ideas

[allcontributors]

@navendu-pottekkat

I've put up a pull request to add @yxlin118! 🎉

[yzevm]

Not really, im newbie in extensions, I use https://developer.chrome.com/extensions/devguide and https://developer.mozilla.org/en-US/docs/Web/API/Window

[yxlin118]

Thanks! I will take a look.

[yxlin118]

I think currently what I am experiencing is that a lot of times it will only start the filtering process after I start to scroll. Not sure if that's a problem with other people too.

[yzevm]

Yeah, its a another issue :D In cases of websites where JS dynamically render DOM elements, we just set timeout right now line in code

Probably related solution of it

[yxlin118]

And a lot of times when I scroll back up the filtered image would reappear and be filtered again. Probably also has to do elements being rendered dynamically?

[yzevm]

Yeah you talk about lazy loading content and its another issue :D, which I'll fix soon #21

[yxlin118]

I think I might have a fix using MutationObserver, and it seems to also fix the issue where scrolling might would make contents visible again. Can I be added to the repo so I can push my branch to set up review and pull request? @navendu-pottekkat

[pottekkat]

@yxlin118 Please for this repo and create a pull request. I will review the code and add it

[yxlin118]

@navendu-pottekkat I don't have access for this repo for me to push a branch and create pull request

[pottekkat]

@yxlin118 You can create a pull request by forking this branch and making changes in your forked version and test it out to make sure everything works. Once you have committed to your forked version, you can create a pull request and we will review it and accept. You don't need access to the repo for making PRs.

Check the docs for more info: https://gist.github.com/Chaser324/ce0505fbed06b947d962

[pottekkat]

And a lot of times when I scroll back up the filtered image would reappear and be filtered again. Probably also has to do elements being rendered dynamically?

Earlier we handled this using a separate function which checks for valid images. If the images have already been replaced then sets a dataset in the image as shown in the code below:

function validImage(image) {
  /*
  Checks if the image is of a certain height and width and check if the image has already been replaced,
  preventing infinite loops.
  */
  const valid = image.src &&
    image.width > 64 && image.height > 64 &&
    !image.dataset.isReplaced;
  console.log('image %s valid', image.src, valid);
  return valid;
}

@YegorZaremba Why did we remove this?

[pottekkat]

@YegorZaremba Could you also check the PR?

[pottekkat]

@YegorZaremba But then we should not be having this issue right?

Also, I am having some problems with @yxlin118 's PR. I am experiencing some issues and some performance issues. Could you check and confirm?

I have invited you as a collaborator. Please check your mail and confirm,

[pottekkat]

@YegorZaremba That is a good idea. We should get more eyes on the project and we will fix the bug

[pottekkat]

We need to fix this ASAP.
https://www.reddit.com/r/webdev/comments/i13apj/block_nsfw_content_using_ai_opensource_web/fzuw3et?utm_source=share&utm_medium=web2x

[pottekkat]

ps. chinese article? dude your marketing skill is awesome

I really do not know how it got there. Maybe because of Product Hunt and the Javascript community

[pottekkat]

Related solution:

• https://stackoverflow.com/a/43245774/10432429
  Moved to v1.1.0 project

ps. chinese article? dude your marketing skill is awesome

What will we change, document.readyState? before the EventListner?