You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
We're trying to lower the number of network requests that hit our servers.
Initially, we thought that using the throttle option would be useful. Yes, that option preserves our CDN and servers, but QuickLink becomes useless for users who scroll down fast, because it continues to fetch links that already exited the viewport, but still in the queue of the throttled requests.
Solution
We'd like to:
Prefetch only links that entered the viewport by more than x% of their area, e.g. if a link is 400 pixels high, prefetch it only when it entered the viewport by at least 100 pixels. This is achievable passing a threshold to the IntersectionObserver. We've tried it, tested it and opened a pull request, see Added threshold option to reduce impact on CDNs and servers #214
Prefetch only links that stayed inside the viewport for a given time, e.g. when users scroll the page fast, avoid prefetching the links that quickly exits the viewport. There are different ways to do that. We initially thought of using throttle but removing the URLs from the throttle queue when links exited the viewport. In the end, we opted to the following solution: assign a timer of y milliseconds to each link, prefetch it when the timer expires, cancel the timer when they exit the viewport. We've tried it, tested it and opened a pull request, see Added delay option to reduce impact on CDNs and servers #213 || Added delay option to reduce impact on CDNs and servers [alternative without data-attributes] #217
Additional context
We've covered both pull requests with a test of the individual option and, additionally, I've created a repo to test 3 options (throttle, threshold and delay) together. Everything works as expected, without side effects. It's currently on a private repository, but no problems to publish it.
(in this issue and pull requests, "we" means me and my workmate @albertonarda)
The text was updated successfully, but these errors were encountered:
Problem
We're trying to lower the number of network requests that hit our servers.
Initially, we thought that using the
throttle
option would be useful. Yes, that option preserves our CDN and servers, but QuickLink becomes useless for users who scroll down fast, because it continues to fetch links that already exited the viewport, but still in the queue of the throttled requests.Solution
We'd like to:
x
% of their area, e.g. if a link is 400 pixels high, prefetch it only when it entered the viewport by at least 100 pixels. This is achievable passing athreshold
to theIntersectionObserver
. We've tried it, tested it and opened a pull request, see Addedthreshold
option to reduce impact on CDNs and servers #214throttle
but removing the URLs from thethrottle
queue when links exited the viewport. In the end, we opted to the following solution: assign a timer ofy
milliseconds to each link, prefetch it when the timer expires, cancel the timer when they exit the viewport. We've tried it, tested it and opened a pull request, see Addeddelay
option to reduce impact on CDNs and servers #213 || Addeddelay
option to reduce impact on CDNs and servers [alternative without data-attributes] #217Additional context
We've covered both pull requests with a test of the individual option and, additionally, I've created a repo to test 3 options (
throttle
,threshold
anddelay
) together. Everything works as expected, without side effects. It's currently on a private repository, but no problems to publish it.(in this issue and pull requests, "we" means me and my workmate @albertonarda)
The text was updated successfully, but these errors were encountered: