Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Why is there always a delay of around 3-4 seconds in loading SOX even after the webpage has fully loaded #325

Closed
GaurangTandon opened this issue Jun 12, 2018 · 12 comments
Assignees
Labels

Comments

@GaurangTandon
Copy link

GaurangTandon commented Jun 12, 2018

Installed Version: 2.1.13DEV Environment: Tampermonkey

I am on a slow internet, if that matters, but I've been using more than a dozen SE userscripts since past several months, and SOX is the first to be delayed for so long even after the page has fully loaded.

Why's it like so? What can be done to reduce the lag time?

@shu8
Copy link
Member

shu8 commented Jun 12, 2018

Honestly, quite a few of the features haven't been optimised and are quite dirty.

I tried a while ago to do stuff like common event listeners for the features so each feature didn't create its own listener to do stuff etc. but it didn't do that much.

Hopefully, one day, I'll go through and try to clean some features up, but I just don't have enough time atm :/

@GaurangTandon
Copy link
Author

GaurangTandon commented Jun 13, 2018

Hmm, no, I wasn't talking about some of the individual features, I was talking about the overall SOX script. The gear icon in the topbar appears at least 3-4 seconds after the page load. I was just worried because, for example, if I've hidden the community bulletin, then I get to see it for the first time the page loads, and then it suddenly disappears (after SOX loads), which is a kinda jarring experience.

It's okay though, the rest of the SOX features are excellent, so it's not really a big deal, but do look at it once you've some free time :)

Update: I just noticed that the loading of Tampermonkey itself is delayed by 3-4 seconds after the page load. Hence, not just SOX, but all userscripts are affected. (but I noticed only SOX first because it has the most visible effect) I'll debug this problem and get back with more updates shortly.

Final update: disabling SOX makes Roomba Forecaster load even before the page loads (example page you can test on). But, with SOX enabled, both SOX and Roomba Forecaster are delayed to well after the page loads. Apparently, SOX is hooking onto some handlers, and delaying loading for both itself and other userscripts :(

@GaurangTandon
Copy link
Author

GaurangTandon commented Jun 13, 2018

I just also saw this error in my console:

Tampermonkey: couldn't load @require from URL sox.enhanced_editor.js 
tms_074b7a5c_3e4d_4844_995b_51e03ce12a9c @ userscript.html?id=074b7a5c-3e4d-4844-995b-51e03ce12a9c:4090

@shu8
Copy link
Member

shu8 commented Jun 13, 2018

@GaurangTandon I'll have a look at it soon, making some more global listeners for all features might help.

also the error in console is from a deprecated feature, I must have left the require in so I'll get rid of that too

@shu8 shu8 self-assigned this Jun 13, 2018
@shu8 shu8 added the bug label Jun 13, 2018
@GaurangTandon
Copy link
Author

GaurangTandon commented Jun 14, 2018

I must have left the require in so I'll get rid of that too

Seems like that's the issue. Among all the userscripts I currently had, SOX is the only one that has tons of require statements in it. I just noticed that because Tampermonkey gives SOX a unique cloud icon on the dashboard. Digging in, SOX seems to require:

https://code.jquery.com/jquery-2.1.4.min.js
https://code.jquery.com/ui/1.11.4/jquery-ui.min.js
https://cdn.rawgit.com/timdown/rangyinputs/master/rangyinputs-jquery-src.js
https://cdn.rawgit.com/jeresig/jquery.hotkeys/master/jquery.hotkeys.js
https://cdnjs.cloudflare.com/ajax/libs/jquery-timeago/1.5.3/jquery.timeago.min.js
sox.github.js
sox.dialog.js
sox.features.js
sox.enhanced_editor.js

sox.css
sox.dialog.html
sox.features.info.json
sox.common.info.json

So many files! Probably that's why SOX delays in loading on my slow internet :(

Also, I don't understand why:

  • the first jquery import is necessary. SE already uses jQuery, so it needn't be imported.
  • there are so many sox.* files . Why are they being imported (and that too separately) instead of being shipped as a part of the single userscript code? I would admit that such a separated file structure is better suited for browser-addons, not good for userscripts

PS: I am not sure about those ui.js, timeago, hotkeys, and rangyinput files. I doubt they are even necessary (SOX is the first text manipulation userscript out of all those out there that uses rangyInput o.O), but I will check out while refactoring the code later.

@shu8
Copy link
Member

shu8 commented Jun 15, 2018

@GaurangTandon If I remember correctly, the jquery import it to work on FF because it didn't used to like to use the jQuery from the website itself

there are so many files because it makes it so much more easy to maintain and develop. It's probably not the reason it delays the script because (at least TM does) they are cached once they are first downloaded, so they shouldn't really need to be fetched again.

about the other ones, I don't remember if they're being used anymore; I'll have a look.

@shu8
Copy link
Member

shu8 commented Jun 16, 2018

I had a look, and those files are being used albeit only in a few features; they could probably be rewritten to not need them at some point, but I won't be able to do it anytime soon.

@GaurangTandon
Copy link
Author

Could you please list those features out? I might be able to help rewrite them to not require those dependencies.

@shu8
Copy link
Member

shu8 commented Jun 16, 2018

@GaurangTandon sure! It'd be great if you had time to!

starting with the easiest probably is kbdAndBullets which uses hotkeys:

$('[id^="wmd-input"]').bind('keydown', 'alt+l', function() {

and

$('[id^="wmd-input"]').bind('keydown', 'alt+k', function() {

just replacing them with a keydown handler on document and checking the keycodes should do it!


timeago is used in quickAuthorInfo

there is a class timeago and it's triggered with $("time.timeago").timeago();.

Not sure how to do this other than polling every few seconds/minutes?


rangyinputs is also used in kbdAndBullets, which uses surroundSelectedText, insertText, and replaceText. I remember looking into this a while back and thought it's a pain to implement to work with Chrome and FF, which is why I used rangyinputs to make it quicker 😆

@GaurangTandon
Copy link
Author

I looked into timeago, and I am pretty sure I can't rewrite it into something much more minimal.

I could probably eliminate rangyInputs though. Could you please confirm it's only used in kbdAndBullets and nowhere else?

@shu8
Copy link
Member

shu8 commented Jul 14, 2018

@GaurangTandon yes, it's only in kbdAndBullets! :)

GaurangTandon added a commit to GaurangTandon/sox that referenced this issue Jul 15, 2018
@GaurangTandon
Copy link
Author

GaurangTandon commented Jul 16, 2018

Great, now we're only with jQuery, jQuery UI, and timeago - each of which I find difficult to reduce atm. Might revisit this later, but closing for now. I'll see if the delay arises again.

shu8 added a commit that referenced this issue Sep 2, 2018
* new dev

* #305

* #307

* #310

* #310

* Better fix for #310

The old fix placed the SOX button to the right of the username, but the username only shows up in the top bar if you're logged in. This meant the SOX button would be absent if you were logged out. This new code should fix that.

* #310

* #309, #313

* #311, #312

* #256

* #319, #317, #316

* #256

* #318

* #294 deprecate enhanced editor

* #308, other small fixes

* #320

* minor fixes (#324)

change scroll top top feature JSON info

* fixes #329 (#330)

also reduces jQuery dependency

* v2.1.4 DEV before push to master

also adds #326

* v2.2.0

* inital DEV push

* update readme to state GM not supported; #306

* reduce dependency on `hotkeys`+minor details (#333)

* #334 fixed

* #334

* #334

* #338

* #335, #338

* Micro optimizations (#336)

* update source link

* micro optimizations

- converted jQuery .not to CSS selector for faster perf (https://stackoverflow.com/questions/8845811/performance-differences-between-using-not-and-not-selectors)
- introduced a separate function to eliminate thrice-repeated (!) code, to keep it DRY

* fixes some issues (#339)

described in #338 (comment)

* fixes #338

* fixes #338 (#340)

1. used addEventListener instead of onload
2. descriptive names (`reader`)
3. optimized extraction of the image URL from the `data`
4. made all declarations `var` and moved them into one place for consistency
5. shortened the POST url to simply `'/upload/image?https=true',` ;P

* #322 implemented

* Sticky property

* Update sox.user.js

* Updating button colors

The main SE buttons use a lighter color than the SOX buttons

* Update sox.css

* Minor fixes

Patched a problem with vote buttons, and fixed the color of the notify on edit button

* Update sox.user.js

* minor changes/fixes

* #341 temporary fix

* Updated mod diamond icon

Updated to the icon, to match the one used by the new topbar

* Updated diamond icon

* Updated mod diamond

* improvements in colorAnswerer (#344)

* improvements in colorAnswerer
1. constant variables+cache answeredID
2. reduce jQuery dependency+shorter a[href] selector via user ID
3. change coloration

* optimization: use filters throughout (#345)

reduces bandwidth consumption

* fixes a few features; adds CSS

Fixes moveBounty, dragBounty, copyCommentsLink.
Adds class for colorAnswerer.
Updates jQuery

* fixes quickAuthorInfo fontawesome icon

* fix a few of #308

* Major improvements in code extensibility, reduced API usage, eliminate redundancy, etc. (#348)

* fixes various bugs mentioned in #348

* fixes standOutDupeCloseMigrated for search pages

* remove unwanted console logs

* #347, various minor tweaks

* fixes small bug in parseCrossSiteLinks

e.g. on this comment: https://meta.stackoverflow.com/questions/370902/i-need-a-lot-of-help-to-write-a-query-for-the-stack-exchange-data-explorer-sh?cb=1#comment608548_370902

* Fixed Meta SE's chat link

Added a / to the end of Meta SE's if statement to fix it. Also replaced "discuss" with "meta" for Area 51 (to match the new URL for Area 51 Discussions), shortened a bit of code, and added some comments

* Fixed Meta SE links

* Changed topbar z-index

Changed the fixed topbar's z-index to match the one on SO, in order to prevent elements like the usercard (z-index: 1000) from covering it

* Made it clearer what the checkbox does

* Many fixes to dialog buttons

Fixes many of the bugs from #308

* Many fixes to dialog buttons

Fixes many of the bugs from #308

* Many fixes to dialog buttons

Fixes many of the bugs from #308

* Many fixes to dialog buttons

Fixes many of the bugs from #308

* Fixed Area 51 Discussions bug

* #348 minor tweak

* fix (#350)

...for answerer ID 13 also matching commenter ids beginning with 13 (1345, 13555, etc.)

* #352, #353 remove yahoo YQL use

* #352

* PR/351 (#355)

* update getQuestionTags

* provide immediate response to user

* minor changes

* #325: remove rangyInputs dependency (#354)

* bump version number

* remove downvotedPostsEditAlert; remove rangyinputs `require`; implement mini changelog in dialog

* install stale and no-response bots

* #356 added, minor bug fix

* start #349, start to move to es6

* onlyShowCommentActionsOnHover bug fix

* #357

* deprecate fixedTopbar feature for #349

* add showTagWikiLinkOnTagPopup feature

* #359 fixed

* #358 fixed

* fixes #360

* fixes for #361

* #361 changes

* v2.3.0 final
shu8 added a commit that referenced this issue Feb 3, 2019
* new dev

* #305

* #307

* #310

* #310

* Better fix for #310

The old fix placed the SOX button to the right of the username, but the username only shows up in the top bar if you're logged in. This meant the SOX button would be absent if you were logged out. This new code should fix that.

* #310

* #309, #313

* #311, #312

* #256

* #319, #317, #316

* #256

* #318

* #294 deprecate enhanced editor

* #308, other small fixes

* #320

* minor fixes (#324)

change scroll top top feature JSON info

* fixes #329 (#330)

also reduces jQuery dependency

* v2.1.4 DEV before push to master

also adds #326

* v2.2.0

* inital DEV push

* update readme to state GM not supported; #306

* reduce dependency on `hotkeys`+minor details (#333)

* #334 fixed

* #334

* #334

* #338

* #335, #338

* Micro optimizations (#336)

* update source link

* micro optimizations

- converted jQuery .not to CSS selector for faster perf (https://stackoverflow.com/questions/8845811/performance-differences-between-using-not-and-not-selectors)
- introduced a separate function to eliminate thrice-repeated (!) code, to keep it DRY

* fixes some issues (#339)

described in #338 (comment)

* fixes #338

* fixes #338 (#340)

1. used addEventListener instead of onload
2. descriptive names (`reader`)
3. optimized extraction of the image URL from the `data`
4. made all declarations `var` and moved them into one place for consistency
5. shortened the POST url to simply `'/upload/image?https=true',` ;P

* #322 implemented

* Sticky property

* Update sox.user.js

* Updating button colors

The main SE buttons use a lighter color than the SOX buttons

* Update sox.css

* Minor fixes

Patched a problem with vote buttons, and fixed the color of the notify on edit button

* Update sox.user.js

* minor changes/fixes

* #341 temporary fix

* Updated mod diamond icon

Updated to the icon, to match the one used by the new topbar

* Updated diamond icon

* Updated mod diamond

* improvements in colorAnswerer (#344)

* improvements in colorAnswerer
1. constant variables+cache answeredID
2. reduce jQuery dependency+shorter a[href] selector via user ID
3. change coloration

* optimization: use filters throughout (#345)

reduces bandwidth consumption

* fixes a few features; adds CSS

Fixes moveBounty, dragBounty, copyCommentsLink.
Adds class for colorAnswerer.
Updates jQuery

* fixes quickAuthorInfo fontawesome icon

* fix a few of #308

* Major improvements in code extensibility, reduced API usage, eliminate redundancy, etc. (#348)

* fixes various bugs mentioned in #348

* fixes standOutDupeCloseMigrated for search pages

* remove unwanted console logs

* #347, various minor tweaks

* fixes small bug in parseCrossSiteLinks

e.g. on this comment: https://meta.stackoverflow.com/questions/370902/i-need-a-lot-of-help-to-write-a-query-for-the-stack-exchange-data-explorer-sh?cb=1#comment608548_370902

* Fixed Meta SE's chat link

Added a / to the end of Meta SE's if statement to fix it. Also replaced "discuss" with "meta" for Area 51 (to match the new URL for Area 51 Discussions), shortened a bit of code, and added some comments

* Fixed Meta SE links

* Changed topbar z-index

Changed the fixed topbar's z-index to match the one on SO, in order to prevent elements like the usercard (z-index: 1000) from covering it

* Made it clearer what the checkbox does

* Many fixes to dialog buttons

Fixes many of the bugs from #308

* Many fixes to dialog buttons

Fixes many of the bugs from #308

* Many fixes to dialog buttons

Fixes many of the bugs from #308

* Many fixes to dialog buttons

Fixes many of the bugs from #308

* Fixed Area 51 Discussions bug

* #348 minor tweak

* fix (#350)

...for answerer ID 13 also matching commenter ids beginning with 13 (1345, 13555, etc.)

* #352, #353 remove yahoo YQL use

* #352

* PR/351 (#355)

* update getQuestionTags

* provide immediate response to user

* minor changes

* #325: remove rangyInputs dependency (#354)

* bump version number

* remove downvotedPostsEditAlert; remove rangyinputs `require`; implement mini changelog in dialog

* install stale and no-response bots

* #356 added, minor bug fix

* start #349, start to move to es6

* onlyShowCommentActionsOnHover bug fix

* #357

* deprecate fixedTopbar feature for #349

* add showTagWikiLinkOnTagPopup feature

* #359 fixed

* #358 fixed

* fixes #360

* fixes for #361

* #361 changes

* v2.3.0 final

* 2.3.0 DEV

* fix for #363

* implemented 'feature packs' in settings dialog

* debugging for #363, fixes #364

* #363 debugging

* fix for #363

* #361 implemented (access token no longer mandatory); minor code cleanup

* #365

* fix #368

* Add #315

* fix #366

* start to use linting

* fix #372

* add #370

* clean up code

* implement #374

* fix #373

* add #370; deprecate pasteImagesDirectly

* #374 replace 'help' instead of prepend new link

* change indentation to 2 spaces

* lint

* implement #296

* implements #376 (linkify meta diamond dialog title)

* fix #375 (topAnswers post score not being found)

* improve customMagicLinks feature -- add button to help menu on all pages

* fix sticky vote buttons feature

* keep new meta posts under diamond even after clicking (#378)

* editComment improve design, add more defaults (#377)

* fix better css feature

* editComment: make dialog delete button smaller

* improve editComment for #377; allow editing; new setting storage format

* add delay to comment features for links to deleted comments #379

* bump to v2.4.0

* Remove accidental letter introduced into file

* Bump installation link version numbers

* Lint
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

2 participants