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.

Sign up for GitHub

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

Refactor utils #8360

Open
wants to merge 7 commits into
base: main
Choose a base branch
from
Open

Refactor utils #8360

Show file tree
Hide file tree
Changes from 6 commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
f136aa0
Refactor ANDROID_VERSION in utils/browser.js
ahmed0saber Jul 14, 2023
9ed2e0a
Refactor bufferedPercent in utils/buffer.js
ahmed0saber Jul 14, 2023
df64c8a
Refactor on function in utils/events.js
ahmed0saber Jul 14, 2023
4c938e0
Refactor filterSource in utils/filter-source.js
ahmed0saber Jul 14, 2023
dee5402
Refactor throttle in utils/fn.js
ahmed0saber Jul 15, 2023
4610a2f
Refactor createTimeRanges in utils/time.js
ahmed0saber Jul 15, 2023
9d71e8a
Fix issue related to reassigning value to constant
ahmed0saber Aug 11, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 3 additions & 2 deletions src/js/utils/browser.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -199,8 +199,9 @@ if (!IS_CHROMIUM) {
const minor = match[2] && parseFloat(match[2]);

if (major && minor) {
return parseFloat(match[1] + '.' + match[2]);
} else if (major) {
return parseFloat(`${match[1]}.${match[2]}`);
}
if (major) {
return major;
}
return null;
Expand Down
10 changes: 3 additions & 7 deletions src/js/utils/buffer.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,8 +18,6 @@ import { createTimeRange } from './time.js';
*/
export function bufferedPercent(buffered, duration) {
let bufferedDuration = 0;
let start;
let end;

if (!duration) {
return 0;
Expand All @@ -30,13 +28,11 @@ export function bufferedPercent(buffered, duration) {
}

for (let i = 0; i < buffered.length; i++) {
start = buffered.start(i);
end = buffered.end(i);
const start = buffered.start(i);
const end = buffered.end(i);

// buffered end can be bigger than duration by a very small fraction
if (end > duration) {
end = duration;
}
end = Math.min(end, duration);
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This tries to redefine a const

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

That's unbelievable mistake, I've fixed it.


bufferedDuration += end - start;
}
Expand Down
11 changes: 5 additions & 6 deletions src/js/utils/events.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -305,12 +305,11 @@ export function on(elem, type, fn) {
for (let m = 0, n = handlersCopy.length; m < n; m++) {
if (event.isImmediatePropagationStopped()) {
break;
} else {
try {
handlersCopy[m].call(elem, event, hash);
} catch (e) {
log.error(e);
}
}
try {
handlersCopy[m].call(elem, event, hash);
} catch (e) {
log.error(e);
}
}
}
Expand Down
17 changes: 7 additions & 10 deletions src/js/utils/filter-source.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -32,19 +32,16 @@ const filterSource = function(src) {
}
});

src = newsrc;
} else if (typeof src === 'string' && src.trim()) {
return newsrc;
} if (typeof src === 'string' && src.trim()) {
// convert string into object
src = [fixSource({src})];
} else if (isObject(src) && typeof src.src === 'string' && src.src && src.src.trim()) {
return [fixSource({src})];
} if (isObject(src) && typeof src.src === 'string' && src.src && src.src.trim()) {
// src is already valid
src = [fixSource(src)];
} else {
// invalid source, turn it into an empty array
src = [];
return [fixSource(src)];
}

return src;
// invalid source, turn it into an empty array
return [];
};

/**
Expand Down
20 changes: 8 additions & 12 deletions src/js/utils/fn.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -60,19 +60,15 @@ export const bind_ = function(context, fn, uid) {
*
* @return {Function}
*/
export const throttle = function(fn, wait) {
let last = window.performance.now();
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This was changed to use window.performance.now() in #5870. Why do you propose changing it to use Date.now()?

Copy link
Author

@ahmed0saber ahmed0saber Aug 11, 2023 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

That's a good question, we use window.performance.now() when we need a high level of accuracy as it is a measurement of floating point milliseconds, but do these 0.153184 milliseconds really matter in our situation? I don't think they matter because we are using 30 milliseconds as a delay for the throttle function which is so huge compared to time % 1, so we can simply neglect these neglectable numbers which have small bad effect on the performance, as window.performance.now() is 3 to 4 times slower than Date.now(), as shown in the following picture:
Screenshot 2023-08-11 162527
Finally, I have initialized lastCallTime with 0, to avoid calling any function that requires a non-zero milliseconds to run.
Also paying some attention to popularity and browser compatibility, we will find that Date.now() is the winner.

Copy link
Member

@gkatsev gkatsev Jan 2, 2024 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The main reason to use performance.now() here isn't the higher resolution but the guarantee of monotonic time updates. I would be inclined to leave it as is due to that.

I'm not sure that the performance difference between Date.now() and performance.now() in this usage are significant enough to worry about.

Copy link
Contributor

@thijstriemstra thijstriemstra Feb 14, 2024 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Perhaps the method used to determine the start time should be configurable, I can imagine performance.now() being superceded by some other better native JS alternative at some point (it never stops, does it) so a method that allows the user to use Date.now() or performance.now() or even nextnewthing.now(), is a reasonable idea, one I should've thought of when I submitted #5870

That being said, please don't change it back to new Date().getTime()!


const throttled = function(...args) {
const now = window.performance.now();

if (now - last >= wait) {
fn(...args);
last = now;
}
export const throttle = function(func, delay) {
let lastCallTime = 0;
return function throttled(...args) {
const currentTime = Date.now()
if (currentTime - lastCallTime >= delay) {
lastCallTime = currentTime;
func(...args);
}
};

return throttled;
};

/**
Expand Down
2 changes: 1 addition & 1 deletion src/js/utils/time.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -141,7 +141,7 @@ function createTimeRangesObj(ranges) {
export function createTimeRanges(start, end) {
if (Array.isArray(start)) {
return createTimeRangesObj(start);
} else if (start === undefined || end === undefined) {
} if (start === undefined || end === undefined) {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
} if (start === undefined || end === undefined) {
}
if (start === undefined || end === undefined) {

return createTimeRangesObj();
}
return createTimeRangesObj([[start, end]]);
Expand Down