John Cox

Blogs · @wyome · Now · Shelf

Interesting

Font-To-Width

Font-To-Width (FTW!) is a script by Nick Sherman and Chris Lewis that fits text snugly into its container by choosing among the width or weight variants of a large type family, instead of scaling font-size the way FitText.js does. Once it picks the best-fitting variant, it fine-tunes with letter- and word-spacing adjustments. The post notes that improvements are on the way, that the current version is available on GitHub, and that its demo, modeled on Jason Santa Maria's photo of shuffleboard standings, uses all six widths of Production Type's Panorama.

Permalink

Understanding JavaScript’s ‘undefined’ | JavaScript, JavaScript...

Sorts out JavaScript's three senses of "undefined" (the type, the primitive value, and the reassignable global variable) and explains ReferenceErrors through the ECMA spec's notion of a Reference with a base value and name. A reference is unresolvable when it is neither a property nor a declared variable, so a bare `foo` throws a ReferenceError, while `foo.bar` on an undefined value throws a TypeError instead. For guarding against globals that may not exist, such as `console` in some browsers, it suggests `window.console && console.log(...)` as a cleaner alternative to a `typeof` check, since existence only needs checking in the global context.

Permalink

Variables vs. Properties in JavaScript | JavaScript, JavaScript...

변수(variable)와 프로퍼티(property)는 같지 않다는 주장입니다. 프로퍼티는 객체에 속한 이름-값 연결이고, 변수는 실행 컨텍스트에 속하며 그 컨텍스트의 VariableObject(함수에서는 ActivationObject)의 프로퍼티로 구현됩니다. 전역에서는 전역 객체와 VariableObject가 같아서 둘이 호환되는 것처럼 보일 뿐입니다. 글은 실질적인 차이를 세 가지로 듭니다. 호이스팅은 변수 선언에만 적용되고 프로퍼티 정의에는 적용되지 않습니다. 변수는 [[DontDelete]]가 true로 생성되어 `delete`가 안 되지만, 명시적으로 만든 프로퍼티는 삭제됩니다. 대괄호 표기법으로는 프로퍼티에만 잘못된 식별자 이름을 붙일 수 있습니다. 여기에 프로퍼티를 정의하는 다섯 가지 방법, eval 안에서 만든 변수는 삭제 가능하다는 예외(Firebug 콘솔에서 변수가 지워지는 이유), kangax와 Soshnikov의 참고 글과 ECMA-262 해당 절 목록이 덧붙어 있습니다.

Permalink

Lesser-Known JavaScript Debugging Techniques

A JavaScript developer who does most of his debugging in Chrome DevTools walks through lesser-known tricks, starting with the console's Command Line API: `debug()` sets a breakpoint on a function reference without hunting through minified source, and `monitor()` just logs calls and arguments. He then covers "traps," meaning debugger statements injected into native methods, custom events, or object getters and setters to find out what code is touching something. He packages these as DebugUtils, a library and Chrome extension with helpers like `$dum`, `$duv`, `$dus` and `$dug`.

Permalink

Why Good Managers Are So Rare - Randall Beck , and James Harter - Harvard Business Review

The saved text is only a short author bio for Jim Harter, Gallup's chief scientist for workplace management and wellbeing, not an article with an argument or findings. It lists his research areas (engagement, productivity, turnover, safety, health) and his books: *Culture Shock* (due May 30, 2023), *Wellbeing at Work* (2021), and *It's the Manager* (2019). If you saved this for a specific piece, the body didn't come through, so the original link would be needed to recover what it actually said.

Permalink

Is jQuery Too Big For Mobile? | Flippin' Awesome

A Canadian-facing casino roundup, updated October 2026, that ranks Cashed (100% match up to €100), SlotsGem (300% up to 10,000 CAD plus 750 free spins) and WinnerIsland ($2,500 plus 100 spins) as its top picks, each with a caveat about bonus ceilings or wagering. Its useful core is a primer on no deposit bonus terms, including a worked example where a $20 bonus at 40x wagering means $800 in stakes before withdrawal. It also covers Interac and other CAD payment options, the advice to verify ID early, and how Ontario's regulated market differs from offshore licensing for player recourse.

Permalink

Metalsmith

This is the homepage for Metalsmith, a Node.js tool that reads a directory of files into plain JavaScript objects and passes them through a chain of plugins before writing the result out. It pitches itself as more than a static site generator, since the core is just an abstraction over a file tree. The same pipeline idea is said to cover scaffolders, build tools, eBook generators, and documentation sites. The page shows the same blog-building example three ways (ESM, CommonJS, and a JSON config), using plugins for collections, markdown, permalinks, and layouts, and lists starter templates and deployment options.

Permalink

Your jQuery: Now With 67% Less Suck ◆ 24 ways

A practical guide to speeding up jQuery code, built around three problem areas the writer keeps seeing in code reviews: slow selectors, poor event delegation, and clumsy DOM manipulation. It ranks selector types from fastest (ID, tag) to slowest (attribute and pseudo-selectors), warns that class selectors crawl in IE8 and below, and recommends scoping searches with `$("#id").find(...)`, chaining methods, and caching any selector used more than once. It then shows how `.on()` with a selector argument replaces a hundred per-cell listeners with a single delegated one on the table, and how building a string in a loop and appending once avoids repeated reflows.

Permalink

jQuery Sheetrock

Sheetrock is a dependency-free JavaScript library (browser or Node.js, with an optional jQuery plugin) that turns a public Google Sheet into a queryable data source. You point it at a sheet's URL, including the #gid, and it can load whole worksheets or run SQL-like Google Visualization queries for sorting, grouping, and filtering. It also supports lazy loading via fetchSize, Handlebars-style templating, and integration with DataTables. The page walks through live examples using 1986 National League batting stats, and notes the constraints: the sheet must be public, have a single header row, and contain plain text only, since formatting and hyperlinks are lost.

Permalink

Questions that are rarely asked (are we ready for “home college”?)

Hollis Robbins proposes "home college": a few families pool money to hire a single well-credentialed professor to teach a tailored first-year liberal-arts curriculum, at roughly two-thirds of one selective-college tuition per student and a real salary for the instructor. She argues students could then transfer in at second- or third-year standing, saving tuition while getting concentrated work on writing, research, and oral presentation (especially useful for non-native English speakers). The main obstacle she names is accreditation, which she suggests could be solved as it was for homeschooling at the secondary level.

Permalink

COLORGLARE | To close or not to close

What was saved here isn't a single article but a blog's index page listing a dozen or so posts, so there's no one argument to recover. The posts cover Svelte 5 internals (createSubscriber, $effect.root, $effect.tracking), a Swift and SwiftUI series for web developers on labels, closures and the basics, and a WebGL particle hero animation built from a three.js prototype into a web-worker version. The rest are smaller front-end pieces: CSS-only skeleton loaders, hamburger buttons that need no JavaScript, typed plain JavaScript, Svelte components exported as web components with CSS reset issues, and whether `<br>` should be written with a closing slash. If you meant to keep one specific piece, you'll need to find its own page.

Permalink

Ratchet - PHP WebSockets

Ratchet's landing page pitches it as a PHP library for building WebSocket applications, with a chat app as the "Hello World" example. It argues that once you grasp event-driven programming, as opposed to the usual HTTP request/response cycle, building on it is quick. It also promotes a modular component architecture you can mix and match, PSR-4 compliance, Symfony2 components that make it feel familiar, and a passing record on WebSocket test suites across supported browsers. It links to a tutorial, a design overview, and a compatibility report.

Permalink

Only 90s Web Developers Remember This

A sweary, nostalgic parody that mock-celebrates 1990s web development as a golden age of "innovation": the 1x1.gif spacer trick for layout, stacked `&nbsp;`s for spacing, CSS first used just to strip link underlines, DHTML snowflakes and popup alerts, tiny pixel fonts, and walls of 88x31 browser and webring buttons. The joke is the deadpan praise for what were really hacks and workarounds, with jabs at IE4's Channels, copy-paste Dynamic Drive scripts (likened to Bootstrap), and today's stacks of abstractions. It ends by urging readers to paste a pile of `&nbsp;`s into their next pull request to mess with teammates.

Permalink

Phinx

Quick-start instructions for Phinx, a PHP database migration tool, covering installation through Composer (`composer require robmorgan/phinx`) and running it from `vendor/bin/phinx`. The walkthrough to a first migration is short: run `init` to generate `phinx.yml`, edit that config, create `db/migrations` and `db/seeds` directories, generate a migration with `create`, then apply it with `migrate -e development`. Worth keeping as a minimal setup cheat sheet rather than a deep guide, since it says nothing about writing migration contents or configuring specific databases.

Permalink

scrollReveal.js

I can't summarise this one: the saved content is just a loading screen ("Please wait while your request is being verified...") with no article text behind it. The page likely hit a bot check or verification step when it was captured. If you re-save it once the real page loads, or paste the text here, I can write a summary that will help you tell it apart from similar pieces.

Permalink

Chosen: A jQuery Plugin by Harvest to Tame Unwieldy Select Boxes

This is the documentation and demo page for Chosen v1.8.7, a jQuery plugin (with a Prototype counterpart) that replaces unwieldy native select boxes with searchable, styled ones. It walks through the features with code snippets: optgroups, placeholder text, hiding search below a threshold, capping multiselect choices, single-select deselection, right-to-left text, custom widths, and the `chosen:updated` event and `destroy` call for changing the underlying select dynamically. It also covers setup (one call to `.chosen()`) and browser support, which includes IE8 but disables Chosen on iPhone and Android mobile devices. It credits Patrick Filler and Harvest as the original developers.

Permalink