Tags: ip

1524

sparkline

Saturday, July 4th, 2020

Feeds

A little while back, Marcus Herrmann wrote about making RSS more visible again with a /feeds page. Here’s his feeds page. Here’s Remy’s.

Seems like a good idea to me. I’ve made mine:

adactio.com/feeds

As well as linking to the usual RSS feeds (blog posts, links, notes), it’s also got an explanation of how you can subscribe to a customised RSS feed using tags.

Then, earlier today, I was chatting with Matt on Twitter and he asked:

btw do you share your blogroll anywhere?

So now I’ve added another URL:

adactio.com/feeds/subscriptions

That’s got a link to my OPML file, exported from my feed reader, and a list of the (current) RSS feeds that I’m subscribed to.

I like the idea of blogrolls making a comeback. And webrings.

Monday, June 22nd, 2020

Always bet on HTML | Go Make Things

I teach JS for a living. I’m obviously not saying “never use of JS” or “JavaScript has no place on the web.” Hell, their are even times where building a JS-first app makes sense.

But if I were going to bet on a web technology, it’s HTML. Always bet on HTML.

Wednesday, June 17th, 2020

Where did the focus go? | Amber’s Website

Amber documents a very handy bit of DOM scripting when it comes to debugging focus management: document.activeElement.

Monday, June 15th, 2020

Notifier — Convert content sources to RSS feeds

A service that—amongst other things—allows you to read newsletters in your RSS reader.

Saturday, June 13th, 2020

Striking a Balance Between Native and Custom Select Elements | CSS-Tricks

I think this a solution worthy of Solomon. In this case, the Gordian knot is the select element and its inevitable recreation in order to style it.

What if we instead deliver a native select by default and replace it with a more aesthetically pleasing one if possible? That’s where the “hybrid” select idea comes into action. It’s “hybrid” because it consists of two selects, showing the appropriate one at the right moment:

  • A native select, visible and accessible by default
  • A custom select, hidden until it’s safe to be interacted with a mouse

The implementation uses a genius combination of a hover media query and an adjacent sibling selector in CSS. It has been tested on a number of device/platform/browser combinations but more tests are welcome!

What I love about this solution is that it satisfies the stakeholders insisting on a custom component but doesn’t abandon all the built-in accessibility that you get from native form controls.

Tuesday, May 26th, 2020

Today’s Javascript, from an outsider’s perspective | Lea Verou

This is a damning and all-too typical example of what it’s like for someone to trying to get to grips with the current state of the JavaScript ecosystem:

Note that John is a computer scientist that knows a fair bit about the Web: He had Node & npm installed, he knew what MIME types are, he could start a localhost when needed. What hope do actual novices have?

I think it’s even worse than that. Not only are potential new devs being put off ever getting started, I know plenty of devs with experience who have pushed out by the overwhelming and needless complexity of the modern web’s toolchain. It’s like a constant gaslighting where any expression of unease is summarily dismissed as being the whinings of “the old guard” who just won’t get with the programme.

John gives up. Concludes never to touch Node, npm, or ES6 modules with a barge pole.

The End.

(Just watch as Lea’s post gets written off as an edge case.)

Tuesday, May 19th, 2020

Measuring Performance behind consent popups – Simon Hearne

  • Opted out experiences are ~35% faster
  • Opting in downloads 2.5MB of additional JavaScript
  • Opted in repeat views are twice as slow as opted out

Sunday, May 17th, 2020

Write Libraries, Not Frameworks by Brandon Smith

This is a very clear description of the differences between libraries and frameworks, along with the strengths and weaknesses of both.

A library is a set of building blocks that may share a common theme or work well together, but are largely independent.

A framework is a context in which someone writes their own code.

I very much agree with the conclusion:

If your framework can be a library without losing much, it probably should be.

Wednesday, May 13th, 2020

Reef

This micro libarary does DOM diffing in native JavaScript:

Reef is an anti-framework.

It does a lot less than the big guys like React and Vue. It doesn’t have a Virtual DOM. It doesn’t require you to learn a custom templating syntax. It doesn’t provide a bunch of custom methods.

Reef does just one thing: render UI.

Tuesday, May 12th, 2020

as days pass by — Hammer and nails

We don’t give people a website any more: something that already works, just HTML and CSS and JavaScript ready to show them what they want. Instead, we give them the bits from which a website is made and then have them compile it.

Spot-on description of “modern” web development. When did this become tolerable, much less normal?

Web developers: maybe stop insisting that your users compile your apps for you? Or admit that you’ll put them through an experience that you certainly don’t tolerate on your own desktops, where you expect to download an app, not to be forced to compile it every time you run it?

The History of the Future

It me:

Although some communities have listed journalists as “essential workers,” no one claims that status for the keynote speaker. The “work” of being a keynote speaker feels even more ridiculous than usual these days.

Monday, May 11th, 2020

Second-guessing the modern web - macwright.org

I’m at the point where you look at where the field is and what the alternatives are – taking a second look at unloved, unpopular, uncool things like Django, Rails, Laravel – and think what the heck is happening. We’re layering optimizations upon optimizations in order to get the SPA-like pattern to fit every use case, and I’m not sure that it is, well, worth it.

Spot-on analysis of what React is and isn’t good for. And lest you think this is blasphemy, Dan Abramov agrees.

Scunthorpe Sans 🗯🚫 profanity-blocking font

Using ligatures to create a s*** font that f***ing censors bad language automatically.

Sunday, May 10th, 2020

Getting Started with the DOM

Here’s a short clear introduction to DOM scripting.

Monday, May 4th, 2020

window.location Cheatsheet - DEV Community 👩‍💻👨‍💻

Everything you ever wanted to know about window.location in JavaScript, clearly explained.

Friday, May 1st, 2020

The beauty of progressive enhancement - Manuel Matuzović

Progressive Enhancement allows us to use the latest and greatest features HTML, CSS and JavaScript offer us, by providing a basic, but robust foundation for all.

Some great practical examples of progressive enhancement on one website:

  • using grid layout in CSS,
  • using type="module" to enhance a form with JavaScript,
  • using the picture element to provide webp images in HTML.

All of those enhancements work great in modern browsers, but the underlying functionality is still available to a browser like Opera Mini on a feature phone.

Front-end Bookmarks

A collection of articles and talks about HTML, CSS, and JS, grouped by elements, attributes, properties, selectors, methods, and expressions.

Tuesday, April 28th, 2020

Principles and priorities | Hacker News

I see that someone dropped one of my grenades into the toilet bowl of Hacker News.