16 ms·

These days, I get by with just two dependencies. One is dqs.js: https://github.com/no-gravity/dqs.js https://github.com/no-gravity/dqs.js Which turns document

by mg 3y ago

These days, I get by with just two dependencies. One is dqs.js: https://github.com/no-gravity/dqs.js https://github.com/no-gravity/dqs.js Which turns document.querySelector('.some .thing') into dqs('.some .thing'). The other one is Handlebars: https://github.com/handlebars-lang/handlebars.js/ https://github.com/handlebars-lang/handlebars.js/ Which I use for all my frontend templating needs.

dylan604 3y ago
are we really concerned about the shortness of the code for the worse tradeoff of being less readable? how much is truly saved by this? these seem like the things of a solo dev vs building something for other people to follow
- mg 3y ago
  What's wrong with solo devs? You are talking to me on a site done by one. This is the frontend code: https://news.ycombinator.com/hn.js https://news.ycombinator.com/hn.js
  - evbogue 3y ago
    hn would benefit from the ael library
  - throw555chip 3y ago
    That's wild, never really looked into it, reminds me how a C programmer thinks. I'm mostly backend but get involved with frontend every now and then. Tried to avoid Angular and React but now trying to teach myself Angular. AngularJS was nice. Angular sucks, very complicated for doing the same things I can do with vanilla HTML/CSS/JS, but that's what companies seem to be hiring for.
  - deleted 3y ago
    [deleted]
  - dylan604 3y ago
    I've been a solo dev as well. But unless you're going to live forever, the code should be maintainable by someone else. You can be a solo dev that's impossible to ever work with, or you can maintain good practices so that other people can play along as well.
  - deathanatos 3y ago
    … is that a good example? … upvote/downvotes are does by fetching an "image", i.e., it does a GET request with side-effects! … also seems like a trivial CSRF vuln, too…
- von_lohengramm 3y ago
  There's a reason why web developers have the reputation they do.
evbogue 3y ago
Combine this with https://github.com/dominictarr/hscrpt https://github.com/dominictarr/hscrpt and you'll be building websites in no time!
bambax 3y ago
Instead of importing dsq you can do this const $ = document.querySelector.bind(document); const $$ = document.querySelectorAll.bind(document);
- mg 3y ago
  That's what I did before I put those lines (and some more) into dqs.js
- throw555chip 3y ago
  That's a neat shortcut, I prefer vanilla JS too.
- gmiller123456 3y ago
  That's pretty much what that include file does, but with "dqs" rather than "$". I'm not a fan of using the $ as it might confuse others that you're using JQuery.
  - bambax 3y ago
    Wouldn't that be a feature? ;-)
  - chrismorgan 3y ago
    $ is what I would expect and prefer, because it’s what I’ve been using in my browser dev tools for over fifteen years (ah, Firebug; fond reminiscences). If your document doesn’t use the names, you’ll get implementations roughly equivalent to these: function $(selector, element = document) { return element.querySelector(selector); } function $$(selector, element = document) { return Array.from(element.querySelectorAll(selector)); } Reference on more magic available in the console (there’s a lot of good stuff): • https://firefox-source-docs.mozilla.org/devtools-user/web_console/helpers/index.html https://firefox-source-docs.mozilla.org/devtools-user/web_co... (I think “:help” is my new favourite: opens that URL, which is not particularly discoverable) • https://developer.chrome.com/docs/devtools/console/utilities/ https://developer.chrome.com/docs/devtools/console/utilities...
- 3y ago
r-spaghetti 3y ago
Can you use Handlebars in Cloudflare workers? EJS was not accepted and string literals are string literals.
- mg 3y ago
  handlebars.js runs in the browser: https://plnkr.co/edit/LXb5TOMoyAxdbTxB https://plnkr.co/edit/LXb5TOMoyAxdbTxB
nicoburns 3y ago
These days? This is what we were using 10 years ago before React came about! It works fine, but performance can be a problem in large apps as handlebars just naively recreates entire DOM trees rather than diffing.

by mg 3y ago

dylan604 3y ago

are we really concerned about the shortness of the code for the worse tradeoff of being less readable? how much is truly saved by this? these seem like the things of a solo dev vs building something for other people to follow

mg 3y ago
What's wrong with solo devs? You are talking to me on a site done by one. This is the frontend code: https://news.ycombinator.com/hn.js https://news.ycombinator.com/hn.js
- evbogue 3y ago
  hn would benefit from the ael library
- throw555chip 3y ago
  That's wild, never really looked into it, reminds me how a C programmer thinks. I'm mostly backend but get involved with frontend every now and then. Tried to avoid Angular and React but now trying to teach myself Angular. AngularJS was nice. Angular sucks, very complicated for doing the same things I can do with vanilla HTML/CSS/JS, but that's what companies seem to be hiring for.
- deleted 3y ago
  [deleted]
- dylan604 3y ago
  I've been a solo dev as well. But unless you're going to live forever, the code should be maintainable by someone else. You can be a solo dev that's impossible to ever work with, or you can maintain good practices so that other people can play along as well.
- deathanatos 3y ago
  … is that a good example? … upvote/downvotes are does by fetching an "image", i.e., it does a GET request with side-effects! … also seems like a trivial CSRF vuln, too…
von_lohengramm 3y ago
There's a reason why web developers have the reputation they do.

evbogue 3y ago

Combine this with https://github.com/dominictarr/hscrpt https://github.com/dominictarr/hscrpt and you'll be building websites in no time!

bambax 3y ago

Instead of importing dsq you can do this const $ = document.querySelector.bind(document); const $$ = document.querySelectorAll.bind(document);

mg 3y ago
That's what I did before I put those lines (and some more) into dqs.js
throw555chip 3y ago
That's a neat shortcut, I prefer vanilla JS too.
gmiller123456 3y ago
That's pretty much what that include file does, but with "dqs" rather than "$". I'm not a fan of using the $ as it might confuse others that you're using JQuery.
- bambax 3y ago
  Wouldn't that be a feature? ;-)
- chrismorgan 3y ago
  $ is what I would expect and prefer, because it’s what I’ve been using in my browser dev tools for over fifteen years (ah, Firebug; fond reminiscences). If your document doesn’t use the names, you’ll get implementations roughly equivalent to these: function $(selector, element = document) { return element.querySelector(selector); } function $$(selector, element = document) { return Array.from(element.querySelectorAll(selector)); } Reference on more magic available in the console (there’s a lot of good stuff): • https://firefox-source-docs.mozilla.org/devtools-user/web_console/helpers/index.html https://firefox-source-docs.mozilla.org/devtools-user/web_co... (I think “:help” is my new favourite: opens that URL, which is not particularly discoverable) • https://developer.chrome.com/docs/devtools/console/utilities/ https://developer.chrome.com/docs/devtools/console/utilities...
3y ago

r-spaghetti 3y ago

Can you use Handlebars in Cloudflare workers? EJS was not accepted and string literals are string literals.

mg 3y ago
handlebars.js runs in the browser: https://plnkr.co/edit/LXb5TOMoyAxdbTxB https://plnkr.co/edit/LXb5TOMoyAxdbTxB

nicoburns 3y ago

These days? This is what we were using 10 years ago before React came about! It works fine, but performance can be a problem in large apps as handlebars just naively recreates entire DOM trees rather than diffing.