~cadence/public-inbox

1

Improving browser compatibility in invidious-redirect

Agustin Ferrari
Details
Message ID
<20200807060257.14458-1-agustinferrari@gmx.com>
DKIM signature
missing
Download raw message
Hello Cadence, I recently found out that invidio.us will stop working in a month and about the project you are working on. I'm writing to (re)send you a commit (or rather patch) according to the tutorial of https://git-send-email.io/ and https://git.sr.ht/~cadence/bibliogram-docs/tree/master/docs/Submitting%20a%20patchset.md I hope you get it right since I do not have much experience with this tool.
I've been making some modifications in src/main.js so that the site can work correctly in as many browsers as possible (including those that don't have full support for ECMAScript 6 or that are not as up to date). The most important changes I made were the following:
* In case fetch is not available, XMLHttpRequest is used. For this I also had to move the code that processes the response to a function called instanceDataProcessor().
* Change const to let in for loops to avoid the "SyntaxError: invalid for/in left-hand side" error in some browsers.
* Convert qa(".loading").forEach(e => e.remove()) in a for loop (in some browsers the result of querySelectorAll() and similar does not have a forEach()).
That's all for now, I hope that this is useful to you and that the project continues to move forward.
Details
Message ID
<74ac9728-5ef7-42ae-9a52-61e8773354bd@disroot.org>
In-Reply-To
<20200807060257.14458-1-agustinferrari@gmx.com> (view parent)
DKIM signature
pass
Download raw message
You haven't supplied the patch here, so I'll reply based on the patch 
that you previously sent to my personal email.

If done correctly, the patch should appear as a section of plaintext at 
the end of the email.

--

I'd like to know which browsers specifically you tried this in, because 
I'm not exactly sure which ones are supposed to be supported now that 
weren't before.

I chose to use ES6 features originally because they are now quite widely 
supported. According to caniuse, the only notable browsers that don't 
support arrow functions (an ES6 feature) are Internet Explorer and Opera 
Mini. I believe it is justified to deliberately not support these 
browsers:


- Not a single person with enough technical knowledge of Invidious will 
be using Internet Explorer. If someone does somehow click an Invidious 
link in IE, they should still see the fallback noscript page.
- Opera Mini breaks every website anyway.

--

However, improving compatibility is a good thing, so I will still 
consider this patch.

Here are my comments on this patch:


- You are still using arrow functions, which are an ES6 feature. Which 
browsers support arrow functions but not const?
- Let is also an ES6 feature. Which browsers support let but not const?
- You should use XMLHttpRequest in all browsers, instead of maintaining 
two code paths.
- The for..of loop you created has worse support than the forEach that 
was previously there. for..of syntax is ES6, whereas, I believe, 
NodeList#forEach is ES5.
- You should abstract XMLHttpRequest into its own function named 
`request` to make the code easier to read.
- Your indentation is messed up. Please indent with tabs and ensure that 
there is a newline at the end of the file.

However, I must ask... why not simply use Babel? It could even be added 
as part of the build process to make things incredibly simple. 
https://babeljs.io/

— Cadence
Export thread (mbox)