Friday Issue Nr.109

What a time to live! CSS can detect JS, and Node, PNPM, and Astro have new versions. Interesting idea about Masonry for CSS and a good post about HTML vs DOM attributes.

JavaScript News

JSR is not another package manager

Post from Ryan Dahl (Creator of Node.js and Deno)

https://deno.com/blog/jsr-is-not-another-package-manager

Find that copy-pasted code

Also, IDE (at least Webstorm) automatically shows copy-pasted code.

https://github.com/kucherenko/jscpd

Detect JavaScript support in CSS

Remember those days when you added the CSS class “no-js” in the body tag, and once JS was loaded, it would remove “no-js” so you could use other styles? Well, now you don’t need to do that.

@media (scripting: enabled) {

  .my-element {

    /* enhanced styles if JS is available */

  }

}

https://ryanmulligan.dev/blog/detect-js-support-in-css/

Node.js 22

https://openjsf.org/blog/nodejs-22-available

PNPM v9.0.0

https://github.com/pnpm/pnpm/releases/tag/v9.0.0

Interesting facts about latency numbers

https://vercel.com/blog/latency-numbers-every-web-developer-should-know

Astro 4.7

https://astro.build/blog/astro-470/

CSS News

CSS Shape

Collection of Shapes made with CSS.

https://css-shape.com/

CSS Masonry

We have Display: block, inline, flexbox, and grid. Maybe there is a way to add something like Waterfall or Masonry. Jen Simmons wrote amazing post about this.

https://webkit.org/blog/15269/help-us-invent-masonry-layouts-for-css-grid-level-3/

HTML attributes vs DOM properties

Here is example from the article:

<div foo="bar">…</div>

<script>

  const div = document.querySelector('div[foo=bar]');

  console.log(div.getAttribute('foo')); // 'bar'

  console.log(div.foo); // undefined

  div.foo = 'hello world';

  console.log(div.getAttribute('foo')); // 'bar'

  console.log(div.foo); // 'hello world'

</script>

https://jakearchibald.com/2024/attributes-vs-properties/

Mixed News

The Front-end Handbook 2024

https://frontendmasters.com/guides/front-end-handbook/2024/

Hardest Problem in Computer Science: Centering Things

If you like UI/UX you will love this post too.

https://tonsky.me/blog/centering/

Comment on Mastodon