OpenStrike is a single-player Counter-Strike-like FPS released for the Sony PSP, running at 60 FPS on hardware with 333 MHz CPU and 32 MB RAM.
The game splits logic: Rust engine handles performance-critical tasks like movement and rendering, while TypeScript/QuickJS manages game rules and HUD via Solid.js with fine-grained reactivity.
Maps use a 1999 GoldSrc BSP format with precomputed visibility sets (PVS) for efficient rendering; a build-time 'cooker' optimizes assets like textures and lighting for PSP hardware.
The project demonstrates a portable JavaScript core (openstrike.js) that runs across platforms, from desktop to handheld, with deterministic testing for debugging and CI.
The article discusses converting a 2014 JavaScript demo that used scroll events to make a search input stick to the top, into a modern CSS-based solution.
Key modern CSS techniques include using `position: sticky` for sticking elements, container queries with `scroll-state` for detecting stuck states, and anchor positioning for precise placement of elements like a hamburger menu.
The old demo inefficiently used JavaScript scroll event listeners and jQuery, while the new approach eliminates JavaScript for better performance and leverages HTML elements like `<search>` for accessibility.
Anchor positioning allows elements like a menu icon to be positioned relative to a named anchor element without traditional constraints, and SVG is recommended over emojis for icons for better markup and control.
A performance issue was investigated in Letta Desktop where increasing usage slowed the product, initially suspected to be due to unoptimized code.
The root cause was found to be the use of 'el.scrollTop = el.scrollHeight;' to scroll the UI on new messages, assuming scrollHeight was a static, performant readonly property.
In reality, scrollHeight is dynamic and recalculated on access, causing slowdowns when frequently updated during high message streams.
The chromium implementation shows scrollHeight triggers layout updates, making it non-performant for frequent use.
A solution was to use a very large number instead of calculating scrollHeight precisely, relying on bounding behavior.
Key advice: Readonly properties can be dynamic and impact performance, especially when obvious changes occur.
Lessons include questioning assumptions about property performance and optimizing UI interactions.
Node.js is the safe default for maximum ecosystem compatibility, especially for production projects and teams with existing Node experience.
Bun offers the fastest startup, installs, and test runner, making it ideal for new projects prioritizing developer experience and serverless deployments.
Deno provides the most secure-by-default sandboxing, best TypeScript-first experience, and, as of version 2.9, leads in raw HTTP throughput.
All three runtimes are production-ready in 2026, with choice depending on specific constraints like security, speed, or compatibility.
Benchmarks show Deno leads in HTTP throughput (133,093 req/s), Bun is fastest in cold start (11 ms), and Bun's install times are significantly faster with warm caches.
Architectural differences: Node.js uses V8 and libuv, Deno uses V8 with a Rust host, and Bun uses JavaScriptCore with a Zig runtime.
TypeScript support varies: Deno offers full runtime type-checking, Bun and Node.js strip types but require external tools for checking.
Ecosystem compatibility: Node.js has near-universal npm support, Bun achieves ~95% compatibility, and Deno allows npm imports via specifiers.
Built-in tooling: Deno has the most comprehensive set, Bun excels in speed for specific tasks, and Node.js relies more on external tools.
Recommendations: Choose Node.js for compatibility and hiring, Bun for speed and DX, Deno for security and TypeScript-first workflows.
JavaScript can be included in web pages via external files (using <script> tag with src attribute) or inline within <script> tags.
Inline <script> tags are increasingly used for self-contained apps and HTML artifacts, but contain pitfalls like the string '</script>' prematurely ending the script.
The HTML specification includes a 'script data double escaped state' loophole where sequences like <!-- followed by <script> prevent normal script termination.
JavaScript build tools and minifiers often fail to correctly handle escaping of problematic strings (</script>, <!--) in literals and expressions for inline <script> tags.
ESBuild performs best among tested tools but still fails to escape <!-- in literals; other tools like Terser, SWC, Oxc, Bun, UglifyJS, Closure Compiler, and minify also fail in various ways.
No JavaScript build tool currently correctly handles all cases for inline <script> tags, highlighting the need for better awareness and handling of these edge cases.