From: Philip Kaludercic <philipk@posteo.net>
To: Daniel Mendler <mail@daniel-mendler.de>
Cc: 69132@debbugs.gnu.org
Subject: bug#69132: [ELPA] Remove jQuery from elpa.gnu.org
Date: Sun, 25 Feb 2024 10:44:45 +0000 [thread overview]
Message-ID: <87il2comaq.fsf@posteo.net> (raw)
In-Reply-To: <87v86cvox0.fsf@daniel-mendler.de> (Daniel Mendler's message of "Sun, 25 Feb 2024 11:06:19 +0100")
[-- Attachment #1: Type: text/plain, Size: 2407 bytes --]
Daniel Mendler <mail@daniel-mendler.de> writes:
> Philip Kaludercic <philipk@posteo.net> writes:
>
> Hello Philip!
>
>>> I was recently surprised to see that elpa.gnu.org uses a jQuery library,
>>> where it really isn't necessary. Re-implementing the same functionality
>>> can be done in a few more lines of plain Javascript, without the need
>>> for any minified code. Tested with relatively recent versions of
>>> Firefox and Chromium, so perhaps it would be nice if someone with an
>>> older browser could check if I didn't make any bold assumptions.
>>
>> I have pushed updated versions of these patches to elpa.git, does the
>> same have to be done for nongnu.git?
>
> I just tried the updated website on elpa.gnu.org and I observed the
> following issues:
>
> - The filtering feels less responsive. I don't know where the problem
> lies, maybe Jquery uses some kind of debouncing, a more efficient
> matching or a more efficient way to manipulate the DOM?
According to the profiler, most of the CPU time went to reflowing CSS.
It appears that if I move around the classList manipulation calls, then
the performance improves.
> - When deleting the input string after filtering, such that the input
> field becomes empty again, all packages are highlighted.
Apparently the issue here is that while an empty string is false-y in
Javascript
"" ? true : false => false
an empty regular expression is true-thy
new RegExp("") ? true : false => false
I updated my patch before pushing it to use RegExp for performance
reasons. Due to the above, my "empty-input" check breaks, and the table
fields are all highlighted, since the empty regular expression matches
every string. That can be easily fixed.
A different issue I noticed is that if I input a malformed regular
expression, say "+", the site freezes due to an exception. I cannot
find any simple analogue for `regexp-quote', but there is a .includes()
method on strings that could be used instead (appears to be well
supported).
> - The jslicense.html website has not been updated yet. Maybe this
> website is also not necessary given that no third-party packages are
> used?
The file has been changed[0], perhaps it also has to be manually updated.
[0] https://git.savannah.gnu.org/cgit/emacs/elpa.git/diff/html/jslicense.html?id=4c73cd608e8da3e614aabc083e2a6078c1e631bb
> Daniel
In effect, I propose these changes:
[-- Attachment #2: Type: text/plain, Size: 1934 bytes --]
diff --git a/html/javascript/package-search.js b/html/javascript/package-search.js
index e603853eda..c690632938 100644
--- a/html/javascript/package-search.js
+++ b/html/javascript/package-search.js
@@ -21,27 +21,38 @@ window.addEventListener("load", function (event) {
search.setAttribute("placeholder", "Search packages...");
search.setAttribute("type", "search");
search.addEventListener("input", function(event) {
- const query = new RegExp(event.target.value, "i");
+ let query = event.target.value;
+
+ if (!query) { // empty input
+ for (let i = 1; i < table.rows.length; i++) {
+ const row = table.rows.item(i);
+ const name = row.childNodes.item(0);
+ const desc = row.childNodes.item(2);
+ name.classList.remove("alt");
+ desc.classList.remove("alt");
+ row.classList.remove("invisible");
+ }
+ return;
+ }
+ query = query.toLowerCase();
for (let i = 1; i < table.rows.length; i++) {
const row = table.rows.item(i);
- row.classList.remove("invisible");
const name = row.childNodes.item(0);
- const name_matches = name.innerText.match(query);
+ const name_matches = name.innerText.toLowerCase().includes(query);
name.classList.remove("alt");
const desc = row.childNodes.item(2);
- const desc_matches = desc.innerText.match(query);
+ const desc_matches = desc.innerText.toLowerCase().includes(query);
desc.classList.remove("alt");
- if (query) { // avoid matching the empty string
- if (name_matches || desc_matches) {
- if (name_matches) { name.classList.add("alt"); }
- if (desc_matches) { desc.classList.add("alt"); }
- } else {
- row.classList.add("invisible");
- }
+ if (name_matches || desc_matches) {
+ row.classList.remove("invisible");
+ if (name_matches) { name.classList.add("alt"); }
+ if (desc_matches) { desc.classList.add("alt"); }
+ } else {
+ row.classList.add("invisible");
}
}
});
[-- Attachment #3: Type: text/plain, Size: 23 bytes --]
--
Philip Kaludercic
prev parent reply other threads:[~2024-02-25 10:44 UTC|newest]
Thread overview: 30+ messages / expand[flat|nested] mbox.gz Atom feed top
2024-02-14 19:41 bug#69132: [ELPA] Remove jQuery from elpa.gnu.org Philip Kaludercic
2024-02-14 23:05 ` Stefan Monnier via Bug reports for GNU Emacs, the Swiss army knife of text editors
2024-02-15 8:12 ` Philip Kaludercic
2024-02-15 11:07 ` Philip Kaludercic
2024-02-15 15:37 ` Stefan Monnier via Bug reports for GNU Emacs, the Swiss army knife of text editors
2024-02-17 18:25 ` Stefan Kangas
2024-02-17 20:57 ` Dmitry Gutov
2024-02-17 21:04 ` Stefan Monnier via Bug reports for GNU Emacs, the Swiss army knife of text editors
2024-02-17 22:26 ` Dmitry Gutov
2024-02-17 22:44 ` Stefan Monnier via Bug reports for GNU Emacs, the Swiss army knife of text editors
2024-02-17 22:49 ` Dmitry Gutov
2024-02-18 4:05 ` Stefan Monnier via Bug reports for GNU Emacs, the Swiss army knife of text editors
2024-02-18 12:14 ` Dmitry Gutov
2024-02-18 14:13 ` Stefan Monnier via Bug reports for GNU Emacs, the Swiss army knife of text editors
2024-02-18 14:24 ` Dmitry Gutov
2024-02-18 14:37 ` Stefan Monnier via Bug reports for GNU Emacs, the Swiss army knife of text editors
2024-02-18 14:38 ` Dmitry Gutov
2024-02-18 3:28 ` Richard Stallman
2024-02-18 4:07 ` Corwin Brust
2024-02-18 4:20 ` Stefan Monnier via Bug reports for GNU Emacs, the Swiss army knife of text editors
2024-02-21 2:56 ` Richard Stallman
2024-02-22 12:00 ` Philip Kaludercic
2024-02-25 3:13 ` Richard Stallman
2024-02-25 10:55 ` Philip Kaludercic
2024-02-25 15:18 ` Stefan Monnier via Bug reports for GNU Emacs, the Swiss army knife of text editors
2024-02-18 15:07 ` Philip Kaludercic
2024-02-18 18:19 ` Corwin Brust
2024-02-24 10:03 ` Philip Kaludercic
2024-02-25 10:06 ` Daniel Mendler via Bug reports for GNU Emacs, the Swiss army knife of text editors
2024-02-25 10:44 ` Philip Kaludercic [this message]
Reply instructions:
You may reply publicly to this message via plain-text email
using any one of the following methods:
* Save the following mbox file, import it into your mail client,
and reply-to-all from there: mbox
Avoid top-posting and favor interleaved quoting:
https://en.wikipedia.org/wiki/Posting_style#Interleaved_style
* Reply using the --to, --cc, and --in-reply-to
switches of git-send-email(1):
git send-email \
--in-reply-to=87il2comaq.fsf@posteo.net \
--to=philipk@posteo.net \
--cc=69132@debbugs.gnu.org \
--cc=mail@daniel-mendler.de \
/path/to/YOUR_REPLY
https://kernel.org/pub/software/scm/git/docs/git-send-email.html
* If your mail client supports setting the In-Reply-To header
via mailto: links, try the mailto: link
Be sure your reply has a Subject: header at the top and a blank line
before the message body.
Code repositories for project(s) associated with this external index
https://git.savannah.gnu.org/cgit/emacs.git
https://git.savannah.gnu.org/cgit/emacs/org-mode.git
This is an external index of several public inboxes,
see mirroring instructions on how to clone and mirror
all data and code used by this external index.