js posts

JS: Replace page text

For this year’s April Fools Day, I decided I wanted to replace some text in the content of my site’s pages to something funny, weird, or confusing. Since I’m moving toward a static site, I wanted to do this client side, which meant replacing text with JavaScript. This would be simple with innerHTML, but that completely replaces the DOM with a new DOM, possibly causing usability and performance issues, and could replace text in URLs, breaking them. Probably a better way is to loop through all nodes on the page, looking for text nodes, and replace text in each of those. So I did this, and it worked nicely. Thought I’d share.

Continue reading post "JS: Replace page text"

Ideas: Cascading Behavior Sheets, a declarative alternative to JS

I have had the idea for some time that the web ought to have a declarative format to define behavior on elements like it does for styles (CSS). It would be an alternative to JavaScript (JS) that would be as robust as CSS, simplifying adding and defining common behaviors. There are a lot of things sites do frequently that can take a fair amount of work for a new person to implement, as well as require a payload sent over the wire. For people who don’t need complications beyond standard, this could be provided by the browser with some configuration in a simple sheet. I think there should be a Cascading Behavior Sheet (CBS) standard for the web.

Potential advantages:

  • robust forward and backward compatibility like CSS
  • simpler, easier to learn format than JS
  • little to write or think about for common functionality
  • little to send over wire for common functionality
  • more performant native implementation possible
  • declarative
  • familiar syntax to CSS devs
  • simple to connect behavior broadly to chosen selectors
  • cascade, @media, @support, etc to limit which and when behaviors apply
  • automatic handling of attaching and removing behaviors when they apply / don’t, including new DOM elements
  • maintain separation of concerns that keeping JS and CSS separate provides
Continue reading post "Ideas: Cascading Behavior Sheets, a declarative alternative to JS"