2ality39
Anthony Fu2
Arcjet Blog29Atriiy6
azukiazusa のテックブログ290
efcl16
Jake Archibald6Joyee Cheung4
Jxck45
leaysgur's Blog37LogRocket Dev403
Mark Erikson's Blog2
mizdra.net20
Overreacted23
Socket200tinyclouds3
TkDodo13Last updated: 2026/03/17 03:00
Tidbit: the software-based camera indicator light in the MacBook Neo runs in the secure exclave¹ part of the chip, so it is almost as secure as the hardware indicator light. …
Here's the handout I prepared for my NICAR 2026 workshop "Coding agents for data analysis" - a three hour session aimed at data journalists demonstrating ways that tools like Claude …
For this issue of What’s !important, we have a healthy balance of old CSS that you might’ve missed and new CSS that you don’t want to miss. This includes random(), random-item(), folded corners using clip-path, backdrop-filter, font-variant-numeric: tabular-nums, the Popover API, anchored container queries, anchor positioning in general, DOOM in CSS, customizable , :open, scroll-triggered animations, , and somehow, more.
この記事では、GitHub Actionsのワークフローをローカルで実行するためのツール「actrun」を紹介しています。actrunは、npx、native、Dockerのいずれかで使用でき、GitHub Actionsの実行を迅速化することを目的としています。特に、クラウド上での実行に伴う遅延を解消し、ローカルでのデバッグを容易にするために開発されました。ユーザーは、特定のコマンドをスキップしたり、実行環境を選択したりすることができ、Nix環境との連携も可能です。actrunは、GitHub Actionsの機能をローカルで模倣し、スクリプト実行のDSLとして機能します。 • GitHub Actionsのワークフローをローカルで実行するツールactrunを開発した。 • actrunはnpx、native、Dockerで使用可能で、クラウド上の遅延を解消する。 • ローカルデバッグを容易にし、特にartifactsの取り出しを簡素化する。 • 特定のコマンドをスキップする設定が可能で、実行環境を選択できる。 • Nix環境との連携が可能で、必要なツールチェーンを提供できる。
Tailwind is really great for making layouts and there are many reasons why. Zell Liew looks at four specific examples of common use cases.
TC39’s March 2026 meeting advanced eight ECMAScript proposals, including Temporal reaching Stage 4 and securing its place in the ECMAScript 2026 speci...
この記事では、Claude CodeのReact習熟度を測るためのベンチマークを作成し、その結果を共有しています。ベンチマークは、Claude Codeの3つのモデル（Haiku, Sonnet, Opus）を対象に、6つのテストケースを用いて実施されました。各モデルは同一のプロンプトで実装され、評価者モデル（Claude Sonnet 4.6）が定義された観点に基づいてコードを採点しました。結果として、SonnetとOpusは高いスコアを記録し、Haikuは明らかに劣ることが示されました。特に、Reactのベストプラクティスや新しいAPIの使用において、SonnetとOpusは一貫して高い評価を得ましたが、全体的に高い習熟度には達していないことが指摘されています。 • Claude CodeのReact習熟度を測るためのベンチマークを作成した。 • 対象モデルはClaude Codeの3つのモデル（Haiku, Sonnet, Opus）。 • 6つのテストケースを用意し、同一のプロンプトで実装させた。 • 評価者モデル（Claude Sonnet 4.6）が観点に基づいてコードを採点した。 • SonnetとOpusは高いスコアを記録し、Haikuは明らかに劣る結果となった。 • Reactのベストプラクティスや新しいAPIの使用において、SonnetとOpusは高評価を得た。 • 全体的に高い習熟度には達していないことが示された。
ライブラリのメンテナが Agent Skills を生成・検証して npm パッケージに同梱することを支援するツールである `@tanstack/intent` を使用して、ライブラリの使用者側と、メンテナ側の両方の観点から Agent Skills を利用する方法を紹介します。
I was a speaker last month at the Pragmatic Summit in San Francisco, where I participated in a fireside chat session about agentic engineering hosted by Eric Lui from Statsig. …
Since January 31, 2026, we identified at least 73 additional malicious Open VSX extensions, including transitive GlassWorm loader extensions targeting...
Vite+ は Vite, Vitest, Oxlint, Oxfmt, Rolldown, tsdown といった人気のツールを統合し、開発, テスト, ビルド, リント, フォーマットなどのフロントエンド開発に必要な機能を1つのツールチェインで提供する新しいフロントエンドツールチェインです。この記事では実際に Vite+ をインストールして、プロジェクトのセットアップから開発、テスト、ビルドまでの一連の流れを試してみました。
PR from Shopify CEO Tobias Lütke against Liquid, Shopify's open source Ruby template engine that was somewhat inspired by Django when Tobi first created it back in 2006. Tobi found …
Six malicious Packagist packages posing as OphimCMS themes contain trojanized jQuery that exfiltrates URLs, injects ads, and loads FUNNULL-linked redi...
JSer.info #766 - TypeScript 6.0 RCがリリースされました。
要素が画面内に入った時にアニメーションを開始するスクロールトリガーアニメーションは、これまでは JavaScript を使用して `Intersection Observer API` を利用する方法が一般的でした。JavaScript を使わずに CSS だけで実装を完結できるようになる `animation-trigger` という新しい CSS プロパティが登場しました。
The GCVE initiative operated by CIRCL has officially opened its publishing ecosystem, letting organizations issue and share vulnerability identifiers ...
Practical Claude Code customizations: shell aliases, custom spinners, notification sounds, a live status line, auto-formatting hooks, and more.
Today in animated explanations built using Claude: I've always been a fan of animated demonstrations of sorting algorithms so I decided to spin some up on my phone using Claude …
It is hard for less experienced developers to appreciate how rarely architecting for future requirements / applications turns out net-positive.
Let’s go over a few demos using the new customizable <select> feature that may be wild, but also give us a great chance to learn new things in CSS.
The project is retiring its odd/even release model in favor of a simpler annual cadence where every major version becomes LTS.
長らく Node.js では偶数バージョン (v22, v24 など) が LTS としてメンテナンスされてました。しかし 2027/4 リリース予定の v27 以降はそうではなくなります。Node.js 公式ブログで、v27 以降に取り入れられる新しいリリーススケジュールについて説明されています。 Node.js — Evolving the Node.js Release Schedule かいつまんで説明すると: major リリースは年2回から年1回となる 奇数番号だけでなく全てのリリースが LTS となる 早期テスト目的で利用されてた奇数リリースは alpha チャンネルで代替される…
AI should help us produce better code - Agentic Engineering Patterns
Published late February to early March 2026, these crates impersonate timeapi.io and POST .env secrets to a threat actor-controlled lookalike domain.
If you maintain a public-facing form, you are already dealing with bots. The difference now is that they are getting harder to spot. Account registration endpoints, marketing sites, demo request flows, and newsletter signups are increasingly targeted by automated systems powered by large language models. These systems can generate realistic
A recent burst of security disclosures in the OpenClaw project is drawing attention to how vulnerability information flows across advisory and CVE sys...
AI assistants are getting better at helping people inside the browser, but they still need too much babysitting.
Radim Marek describes the new pg_restore_relation_stats() and pg_restore_attribute_stats() functions that were introduced in PostgreSQL 18 in September 2025. The PostgreSQL query planner makes use of internal statistics to help it …
How we look at the stacking order of our projects, how we choose z-index values, and more importantly, the implications of those choices.
Set up the Playwright MCP server with Claude Code in one command. Covers self-QA, exploratory testing, storage state, and troubleshooting.
Learn a production-safe Figma-to-code workflow in Cursor: preserve logic, reuse tokens, refine in Visual Editor, and reduce handoff drift.
Learn how designers use Cursor in real repos: run local UI, find components, edit safely with Visual Editor, and ship reviewable changes.
Learn Cursor’s greenfield workflow for designers: prompt UI, run local preview, refine in Visual Editor, and build reusable components fast.
Questions for developers: “What’s the one area you’re afraid to touch?” “When’s the last time you deployed on a Friday?” “What broke in production in the last 90 days that …
この記事では、ReactにおけるポップコーンUIの問題とその解決策について説明しています。ポップコーンUIとは、複数のローディングスピナーがランダムに表示され、ユーザー体験を損なうUIのことを指します。特に、データフェッチを各コンポーネントで個別に行うと、このような現象が発生しやすくなります。解決策として、親コンポーネントでデータフェッチを中央集権的に管理し、ローディング状態を統合的に扱う方法が提案されています。また、Tanstack QueryのuseIsFetchingや<Suspense>コンポーネントを利用することで、ポップコーンUIを避けることができると述べられています。 • ポップコーンUIは、複数のローディングスピナーがランダムに表示されるUIで、ユーザー体験を損なう。 • データフェッチを各コンポーネントで個別に行うとポップコーンUIになりやすい。 • 親コンポーネントでデータフェッチを中央集権的に管理することで、ローディング状態を統合的に管理できる。 • Tanstack QueryのuseIsFetchingを利用することで、ページ全体のデータフェッチ状況を管理できる。 • Reactの<Suspense>コンポーネントを使用することで、ローディング状態の管理を境界単位で考えることができる。
Agentic manual testing - Agentic Engineering Patterns
Mixed-script homoglyphs and a lookalike domain mimic imToken’s import flow to capture mnemonics and private keys.
Latio’s 2026 report recognizes Socket as a Supply Chain Innovator and highlights our work in 0-day malware detection, package health, and auto-patchin...
Over the past few months it’s become clear that coding agents are extraordinarily good at building a weird version of a “clean room” implementation of code. The most famous version …
Sure, we can select the <html> element in CSS with, you know, a simple element selector, html. But what other (trivial and perhaps useless) ways can we do it?
Anti-patterns: things to avoid - Agentic Engineering Patterns
WebHaptics は、Web アプリケーションで触覚フィードバックを実装するための JavaScript ライブラリです。iOS Safari でも触覚フィードバックを提供することができます。この記事では、WebHaptics ライブラリの概要と、どのようにして iOS Safari で触覚フィードバックを実現しているのかについて解説します。
この記事では、サイボウズがW3Cのメンバーに加入したことを受けて、フロントエンドエンジニアがWeb標準に関する最新の動向をまとめています。具体的には、翻訳対象となる新しい属性の提案や、JavaScript不要でスワイプ操作を実現するDeclarative Overscroll Actionsの導入、CSSのmargin-trimプロパティ、PWAにおけるアクセントカラーのスコープの変更、CSSのrevert-ruleキーワードの導入、疑似要素をJavaScriptから扱いやすくする提案、Selectors Level 5の新しい擬似クラスの追加などが紹介されています。これらの情報は、Web開発における標準化の進展を示しており、フロントエンド技術の向上に寄与するものです。 • サイボウズがW3Cのメンバーに加入し、Web標準のキャッチアップを行っている。 • 新しい属性translatable-data-*が提案され、data-*属性を翻訳対象にすることが可能になる。 • Declarative Overscroll Actionsにより、JS不要でスワイプ操作を実現する方法が提案されている。 • CSSのmargin-trimプロパティが導入され、要素のマージンを除去できるようになる。 • PWAにおけるアクセントカラーのスコープが変更され、通常のWebページではUA既定の色にフォールバックする。 • CSSのrevert-ruleキーワードが導入され、直前のCSSルールに戻すことが可能になる。 • 疑似要素をJavaScriptから扱いやすくするためのCSSPseudoElementインターフェースが提案されている。 • Selectors Level 5の新しい擬似クラスが追加され、より柔軟なセレクタが可能になる。
Set up Claude Code MCP servers with step-by-step commands, configuration scopes, and Tool Search for 85% less context usage. Plus troubleshooting fixes.
Join Socket for live demos, rooftop happy hours, and one-on-one meetings during BSidesSF and RSA 2026 in San Francisco.
Malicious Packagist packages disguised as Laravel utilities install an encrypted PHP RAT via Composer dependencies, enabling remote access and C2 call...
Security tooling has a habit of turning into infra work. You start with something simple like rate limiting or bot protection. Suddenly you are configuring a proxy, updating DNS, or introducing a new layer in front of your app. What should have been a small code change becomes a cross-team
How the e18e community have been collaborating with npmx to create a better experience for the ecosystem
「毎時何時に実行」や「何時間ごとに実行」といった、タスクスケジューリングを実装する機会は少なくない。タスクを実装し cron に登録すれば、動くものを実装するのは難しくない。しかし、ひとたびタスクが思うように動かなかった途端、隠れていた要件が牙を剥く。一度でも痛い目を見た人...
GIF optimization tool using WebAssembly and Gifsicle - Agentic Engineering Patterns
この記事では、Async React時代における宣言的UIの概念とその実装方法について解説しています。宣言的UIは、開発者がやりたいことをロジックとして記述し、具体的なDOM操作や最適化はReactが自動的に行うという考え方です。特に、useStateなどのステート管理を通じて、アプリケーションのロジックを簡潔に記述できることが強調されています。デバウンスの例を通じて、ユーザー入力に対するフィルタリング処理を遅延させることで、パフォーマンスを向上させる方法が示されています。最終的に、Reactが開発者の負担を軽減し、より本質的なロジックに集中できる環境を提供することが目指されています。 • 宣言的UIは、開発者がやりたいことをロジックとして記述し、具体的なDOM操作はReactが自動的に行う。 • Async Reactは宣言的UIの考えをさらに推進している。 • useStateなどのステート管理を通じて、アプリケーションのロジックを簡潔に記述できる。 • デバウンスを使用することで、ユーザー入力に対するフィルタリング処理を遅延させ、パフォーマンスを向上させる。 • Reactが開発者の負担を軽減し、実装者が本質的なロジックに集中できる環境を提供することが目指されている。
Choosing between Popover API and Dialog API is difficult because they seem to do the same job, but they don’t! After a bit lots of research, I discovered that the Popover API and Dialog API are wildly different in terms of accessibility and we'll go over that in this article.
OpenVSX releases of Aqua Trivy 1.8.12 and 1.8.13 contained injected natural-language prompts that abuse local AI coding agents for system inspection a...
Every way to run Claude Code from your phone—SSH, Remote Control, third-party apps, and cloud agents—with the trade-offs of each approach.
Learn what Claude Code is, how the agentic loop works, and what it costs. MCP, agent teams, pricing, installation, and Cursor comparison.
レスポンシブデザインにおいてメディアクエリを使用して異なる画面サイズに対して異なるフォントサイズを指定する方法は一般的ですが、いくつかの課題点もあります。`clamp()` 関数を使用することで、画面幅の変化に対してフォントサイズが滑らかに変化するようにできます。また煩雑なメディアクエリの管理を減らすことができます。
この記事では、エージェントによって書かれたコードの理解を深めるための「インタラクティブな説明」の重要性について述べています。特に、コードがブラックボックス化すると、新機能の計画が難しくなり、技術的負債が蓄積されることが指摘されています。著者は、Rustを使用して「ワードクラウド」を生成するアプリケーションの開発を通じて、コードの詳細を理解するための手法を紹介しています。具体的には、アニメーションを用いた説明を作成することで、アルゴリズムの動作を視覚的に理解する方法を提案しています。これにより、コードの構造や動作を直感的に把握できるようになります。 • エージェントによって書かれたコードの理解が重要であること • コードがブラックボックス化すると新機能の計画が難しくなる • Rustを使用したワードクラウド生成アプリの開発事例 • アニメーションを用いた説明が理解を助ける • インタラクティブなインターフェースが概念の説明に役立つ
minimatch patched three high-severity ReDoS vulnerabilities that can stall the Node.js event loop, and Socket has released free certified patches.
この記事では、Claude Codeのリモートコントロール機能を利用して、スマホやブラウザからローカルパソコンで開いているセッションを操作する方法について説明しています。リモートコントロール機能は、ローカルマシン上で動作し、複数の端末から同時に操作できる利点があります。また、スマホにプッシュ通知を送るためのNotification HookとBarkアプリの使用方法も紹介されています。リモートコントロール機能は現在リサーチプレビュー版で、Maxプラン以上で利用可能です。設定方法やセッションの管理方法についても詳しく解説されています。 • Claude Codeのリモートコントロール機能を使ってスマホからローカルセッションを操作できる。 • Notification HookとBarkを使用してスマホにプッシュ通知を送信する方法を解説。 • リモートコントロール機能はローカルマシン上で動作し、複数端末からの同時操作が可能。 • セッションは自動で再接続され、中断に強い。 • リモートコントロール機能はMaxプラン以上で利用可能で、設定方法が詳細に説明されている。
Here's a little prototype I built this morning from my phone as an experiment in HTTP range requests, and a general example of using LLMs to satisfy curiosity. I've been …
Despite what’s been a sleepy couple of weeks for new Web Platform Features, we have an issue of What’s !important that’s prrrretty jam-packed. The web community had a lot to say, it seems, so fasten your seatbelts!
TL;DR: We can center absolute-positioned elements in three lines of CSS. And it works on all browsers!
Socket uncovered 26 malicious npm packages tied to North Korea's Contagious Interview campaign, retrieving a live 9-module infostealer and RAT from th...
Codex CLI v0.105.0に音声入力機能（Voice Transcription）が追加され、スペースキーを長押しすることで録音が開始され、離すと文字起こしが行われる。APIキー認証時はgpt-4o-transcribeモデルを使用し、ChatGPT認証時は/backend-api/transcribeエンドポイントを利用する。macOSでの動作が確認されているが、Linuxには未対応。録音にはcpalライブラリが使用され、音声データはhoundクレートでWAV形式にエンコードされる。機能の有効化はコマンドラインから行うことができ、設定ファイルを直接編集することも可能。トラブルシューティングとして、Linux未対応やマイクのアクセス許可が必要であることが挙げられている。 • Codex CLI v0.105.0で音声入力機能が追加された。 • スペースキーを長押しで録音、離すと文字起こしが行われる。 • APIキー認証時はgpt-4o-transcribeモデルを使用、ChatGPT認証時は/backend-api/transcribeエンドポイントを使用。 • macOSでの動作確認済み、Linuxは未対応。 • 録音にはcpalライブラリを使用し、音声データはhoundクレートでWAV形式にエンコードされる。 • 機能の有効化はコマンドラインから行うことができ、設定ファイルを直接編集することも可能。 • トラブルシューティングとして、Linux未対応やマイクのアクセス許可が必要。
An impersonated golang.org/x/crypto clone exfiltrates passwords, executes a remote shell stager, and delivers a Rekoobe backdoor on Linux.
この記事では、ソフトウェア開発における生産性向上のための「エージェント工学パターン」について述べられています。著者は、知識を蓄積することの重要性を強調し、特に技術的な問題に対する解決策を見つけるための質問に対する答えを持つことが、機会を見つける助けになると述べています。著者は、自身のブログやGitHubリポジトリを通じて、さまざまなプロジェクトのコードや解決策を収集しており、最近ではLLMを活用して興味深い問題に対するコードソリューションを拡充しています。また、収集した資産を利用して、既存の例を組み合わせて新しいものを作る手法についても触れています。特に、PDFファイルから画像を生成するブラウザベースのOCRツールの開発例が紹介されています。 • ソフトウェア開発における生産性向上のための知識の蓄積が重要であること • 技術的な問題に対する解決策を見つけるための質問に対する答えを持つことが機会を見つける助けになる • 著者は自身のブログやGitHubリポジトリを通じてコードや解決策を収集している • LLMを活用して興味深い問題に対するコードソリューションを拡充している • 収集した資産を利用して既存の例を組み合わせて新しいものを作る手法が有効であること
A New Study Has Answers
JSer.info #765 - Electrobun v1がリリースされました。
Paper は AI エージェントを通じてコードとキャンバスを双方向に接続するデザインツールで、AI にデザインの作成やコードへの変換を任せることができます。Paper の MCP サーバーのツールを組み合わせることでキャンバス上のノードの情報を取得したり、デザインを挿入・編集したりすることができます。この記事では実際に Paper を試して、コードからデザインへ、デザインからコードへの双方向のワークフローがどのように実現されているのかを紹介します。
Explore what happened in Node.js in February 2026, including v24.14.0 LTS, v25.7.0 Current, patch releases, and new security reporting requirements.
npm rolls out a package release cooldown and scalable trusted publishing updates as ecosystem adoption of install safeguards grows.
Read an explanation of the recent CVE-2026-2441 vulnerability that was labeled a "CSS exploit" that "allowed a remote attacker to execute arbitrary code inside a sandbox via a crafted HTML page."
It's become very apparent over the past few months that a comprehensive test suite is enough to build a completely fresh implementation of any open source library from scratch, potentially …
I gave a talk this weekend at Social Science FOO Camp in Mountain View. The event was a classic unconference format where anyone could present a talk without needing to …
「npm-package-template」という、id:mizdra が爆速で npm package を実装するための開発テンプレートがある。以前ブログで紹介した。 github.com www.mizdra.net 毎年ちょっとした変更を加えているのだけど、今年は色々な事情があって大きな変更を加えた。高速な formatter/linter が登場したり、npmjs.com へのサプライチェーン攻撃が流行ったり、Coding Agent が普及したり... 時代が変化してるので、それに合わせたテンプレートに変えてみた。 Update 2026/02 (Part 1) by mizdra …
Learn how to design secure, user-friendly 2FA recovery flows. Explore recovery methods, lockout prevention, risk trade-offs, and UX best practices.
Browsers don't just let you bookmark web pages. You can also bookmark JavaScript, allowing you to do so much more than merely save pages.
Angular Signal Forms simplify reactive forms, validation, and custom controls—making Angular 21’s developer experience dramatically better.
A practical guide for PMs on using session replay safely. Learn what data to capture, how to mask PII, and balance UX insight with trust.
Discover what's new in The Replay, LogRocket's newsletter for dev and engineering leaders, in the February 25th issue.
Chat SDK は TypeScript で記述されたライブラリで、1 つのコードベースで複数のチャットプラットフォームに対応するチャットボットを開発できるようになります。イベント型アーキテクチャを採用しており、メンション, メッセージ, リアクション, スラッシュコマンドなどのイベントに型安全なハンドラーを定義できます。この記事では実際に Chat SDK を使用して、Slack 向けのチャットボットを実装する方法を紹介します。
If you are a developer working on a marketing or growth team, you have probably implemented this rule at least once: Only accept business email addresses. It usually comes from a reasonable request. Marketing wants better lead quality. Sales is tired of fake demo requests. Operations wants cleaner CRM data.
この記事では、コーディングエージェントを使用してコードベースの構造的なウォークスルーを行う方法について説明しています。著者は、SwiftUIスライドプレゼンテーションアプリを作成した際に、コードの詳細を理解するためにClaude Codeを使用しました。具体的には、リポジトリを指示し、コードの読み取りと詳細なウォークスルーの計画を行うように促しました。Showboatというツールを使って、Markdown形式でドキュメントを作成し、コードのスニペットを自動的に追加することで、誤りを避けることができました。このプロセスを通じて、著者はSwiftUIアプリの構造やSwift言語の詳細を学びました。記事は、LLM（大規模言語モデル）が新しいスキルを学ぶ速度を低下させる可能性について懸念する人々に対し、このようなパターンを採用することを推奨しています。 • コーディングエージェントを使用してコードベースの構造的なウォークスルーを行うことができる。 • Showboatツールを使用して、Markdown形式でドキュメントを作成し、コードのスニペットを自動的に追加する。 • Claude Codeを使用して、リポジトリのコードを読み取り、詳細なウォークスルーを計画する。 • このプロセスを通じて、SwiftUIアプリの構造やSwift言語の詳細を学ぶことができる。 • LLMが新しいスキルを学ぶ速度を低下させる可能性があるが、こうしたパターンを採用することで学習機会を増やせる。
Discover how designers can use Claude Code and Figma to iterate faster, build higher-fidelity UI, and safely ship changes without breaking production.
http://localhost:3000 での開発には限界がある。しかし、本番と同じように https://example.com でアクセスできる環境をローカルに作るには、ドメインの解決、証明書の発行、443 での起動など、少し手間がかかる。そこで、必要な全てを 1 つ...
AI agents are writing more code than ever, and that's creating new supply chain risks. Feross joins the Risky Business Podcast to break down what that...
The Go ecosystem is really good at tooling. I just learned about this tool for analyzing the size of Go binaries using a pleasing treemap view of their bundled dependencies. …
Learn how Google & Shopify’s UCP enables AI agents to discover products, manage carts, and complete secure online transactions.
WCAG 2.2 では、ユーザーが画像拡大ソフトや支援技術を使用せずに、200% までテキストを拡大してもコンテンツが正しく表示されることを要求しています。しかし、テキストサイズの拡大に関しては、ブラウザや OS の設定を尊重せず、ユーザーがテキストサイズを拡大してもコンテンツが拡大されないという問題が長年存在していました。この記事では、この問題の原因と解決策について解説します。
A deep technical breakdown of the Node.js Event Loop, libuv, thread pool behavior, and the real causes of production latency and blocking.
Really interesting case-study from Andreas Kling on advanced, sophisticated use of coding agents for ambitious coding projects with critical code. After a few years hoping Swift's platform support outside of …
I’ve started a new project to collect and document Agentic Engineering Patterns—coding practices and patterns to help get the best results out of this new era of coding agent development …
Learn how product managers use Cursor to draft PRDs, generate Jira tickets, and prototype features. 5 workflows, setup guide, and honest limitations.
Socket uncovered four malicious NuGet packages targeting ASP.NET apps, using a typosquatted dropper and localhost proxy to steal Identity data and bac...
Design better two-factor authentication experiences. Explore SMS, TOTP, and biometric 2FA flows, UX pain points, failures, and recovery strategies.
この記事では、エージェント工学のパターンと、コーディングのコストが低下したことによる影響について論じています。従来、コードを書くことは高コストであり、開発者は時間を効率的に使うためにプロジェクトの設計や計画に多くの時間を費やしてきました。しかし、コーディングエージェントの登場により、コードを書くコストが劇的に下がり、これまでのトレードオフの考え方が揺らいでいます。良いコードを提供することは依然として高コストであり、バグがなく、適切にドキュメント化され、将来の変更に対応できる設計が求められます。エージェント工学の利点を活かすためには、新しい習慣を築く必要があります。 • コーディングのコストが低下したことによる影響を考慮する必要がある。 • 良いコードは依然として高コストであり、バグがないことや適切なドキュメントが求められる。 • エージェント工学の導入により、開発者は同時に複数の場所で作業できるようになる。 • 新しい個人および組織の習慣を築くことが重要である。 • YAGNI（必要のない機能を予測してコードに複雑さを加えないこと）を維持することが重要。
Let’s get nuanced in this article and discuss the capabilities of both SVG and raster imaged so that you can make informed decisions in your own work.
Discover the most common React Server Component performance mistakes — from blocking top-level awaits to layout async traps — and how to restore streaming.
Gil Fink (SparXis CEO) joins PodRocket to break down today’s most common web rendering patterns: SSR, CSR, static rednering, and islands/resumability.
この記事では、bitとbit-relayを使用したP2Pコラボレーション開発ツールの紹介が行われている。bitはGit互換のCLIツールで、bit-relayはP2P中継サーバーを介してGitHubを経由せずにリポジトリのクローンやプッシュを行うことができる。bitはissueやPRのストレージを内蔵しており、GitHubに依存せずにこれらを管理できる。具体的な使い方として、リポジトリの作成、issueの作成、リレーサーバーを介した共有方法が示されている。また、bitとbit-relayの利点として、分散型のissue/PR管理や、NAT/ファイアウォール越しのリポジトリ共有が挙げられている。最終的には、P2Pで開発されたものをGitHubに同期することが想定されている。 • bitはGit互換のCLIツールで、e2eテストを通過している。 • bit-relayはP2P中継サーバーを介してGitHubを経由せずに操作が可能。 • bitはissueとPRのストレージを内蔵し、中央サーバーに依存しない管理ができる。 • リレーサーバーを使用することで、NATやファイアウォール越しにリポジトリを共有できる。 • 分散型のissue/PR管理が可能で、特定のホスティングに依存しない。
この記事では、テスト駆動開発（TDD）の手法である「赤/緑TDD」について説明しています。TDDは、コードを書く際に自動テストを伴うプログラミングスタイルで、特にテストファースト開発が重要です。まず自動テストを作成し、それが失敗することを確認した後、実装を行いテストが通るようにします。この手法は、コーディングエージェントが無駄なコードを生成したり、動作しないコードを書くリスクを軽減します。プロジェクトが成長するにつれて、既存の機能が壊れるリスクが高まるため、包括的なテストスイートが重要です。赤/緑のプロセスは、テストが失敗することを確認し、その後に実装を行うことを強調しています。 • TDD（テスト駆動開発）は、コードを書く際に自動テストを伴うプログラミングスタイルである。 • テストファースト開発が最も厳格なTDDの形で、まずテストを作成し、失敗を確認してから実装を行う。 • コーディングエージェントが無駄なコードや動作しないコードを書くリスクを軽減する。 • プロジェクトが成長するにつれて、既存機能が壊れるリスクが高まるため、包括的なテストスイートが重要。 • 赤/緑のプロセスは、テストが失敗することを確認し、その後に実装を行うことを強調している。
Git Worktree を作成するとき、.gitignore に指定している .env ファイルなどがコピーされないという問題があります。この問題を解決するために Claude Code のデスクトップバージョンでは .worktreeinclude で .gitignore で除外されているファイルを含めることができます。
Building reusable abstractions on top of libraries that rely on type inference can be deceptively difficult, which is why we need better ways to build those abstractions ...
Claude Codeを使ったブラウザベースのビジュアル編集ツールとして、design-loopを作りました。
Claude Code のデスクトップアプリに新しい Preview 機能がリリースされました。これを使用すると、コードから起動したアプリケーションの UI を直接確認しながら、同時にログやコードも確認して問題を解決できます。この記事では Preview 機能の使い方を紹介します。
I’ve been wanting to add indications of my various other online activities to my blog for a while now. I just turned on a new feature I’m calling “beats” (after …
An emerging npm supply chain attack that infects repos, steals CI secrets, and targets developer AI toolchains for further compromise.
Danny has several ideas for how we could use :near(), a proposed pseudo-class that detects when the pointer is near an element.
Maryam Ashoori, VP of Product and Engineering at IBM’s Watsonx platform, talks about the messy reality of enterprise AI deployment.
Socket is proud to join the OpenJS Foundation as a Silver Member, deepening our commitment to the long-term health and security of the JavaScript ecos...
Learn how to design secure, user-friendly two-factor authentication (2FA) systems. Compare methods, user flows, recovery options, and future trends.
Learn how to use CSS @container scroll-state to replace scroll listeners and layout measurements with declarative state queries for smoother, scroll-driven UI.
I've long been resistant to the idea of accepting sponsorship for my blog. I value my credibility as an independent voice, and I don't want to risk compromising that reputation. …
Multi-agent coding workflows promise speed, but shared state causes collisions. Learn practical fixes and why isolation plus orchestration matters.
npm now links to Socket's security analysis on every package page. Here's what you'll find when you click through.
Back in August 2024 the Ladybird browser project announced an intention to adopt Swift as their memory-safe language of choice. As of this commit it looks like they've changed their …
25+ years into my career as a programmer I think I may finally be coming around to preferring type hints or even strong typing. I resisted those in the past …
Russ Miles, a software development expert and educator, joins the show to unpack why “developer productivity” platforms so often disappoint.
Discover what's new in The Replay, LogRocket's newsletter for dev and engineering leaders, in the February 18th issue.
A compromised npm publish token was used to push a malicious postinstall script in [email protected], affecting the popular AI coding agent CLI with 90k wee...
The distinction between "components" and "utilities" seems clear at first glance, but gets a little blurred when working with them in Tailwind.
Learn how to recreate Claude Skills–style workflows in GitHub Copilot using custom instruction files and smarter context management.
A product manager’s guide to deciding when automation is enough, when AI adds value, and how to make the tradeoffs intentionally.
Claude Code to Figma はコードから Figma デザインを生成するための機能です。Figma MCP サーバーの `generate_figma_design` ツールを使用して、ローカルで開発したコードから Figma デザインを生成して、さらに Figma 上で編集した内容をコードに反映させるという双方向のワークフローが実現できるようになります。
Learn how N|Sentinel turns Node.js CPU profiles into validated, optimized code in minutes with AI-driven performance remediation.
My Rodney CLI tool for browser automation attracted quite the flurry of PRs since I announced it last week. Here are the release notes for the just-released v0.4.0: Errors now …
Set up Claude Code to Figma in under 2 minutes. Tutorial covers the roundtrip workflow, its limitations, and a single-tool alternative.
Socket is now scanning AI agent skills across multiple languages and ecosystems, detecting malicious behavior before developers install, starting with...
Socket now supports PHP with full Composer and Packagist integration, enabling developers to search packages, generate SBOMs, and protect their PHP de...
Lee accepts a challenge: arranging text in a spiral that animates as a vortex on scroll... all in CSS.
Most attack detection still treats applications like interchangeable boxes: requests come in, signatures are matched, packets are inspected, and decisions are made in isolation. That approach worked when attacks were noisy, infrastructure‑level, and largely the same across apps. Today’s attacks are quieter, more targeted, and deeply tied to
This is the story of the United Space Ship Enterprise. Assigned a five year patrol of our galaxy, the giant starship visits Earth colonies, regulates commerce, and explores strange new …
macOSのlaunchdエージェント・デーモンをGUIで管理できるアプリ launchd-ui を作りました。
I introduced Showboat a week ago—my CLI tool that helps coding agents create Markdown documents that demonstrate the code that they have created. I’ve been finding new ways to use …
コロナ禍が明け、カンファレンス文化も再開し、コロナ前かそれ以上の頻度で多くのカンファレンスが企画されるようになりました。しかし、コロナ中の断絶によってノウハウの継承が途絶えた部分もあり、後発のイベントが既知の失敗を重ねている場面も見られます。そこで、カンファレンス主催者の有...
JSer.info #764 - TypeScript 6.0 Betaがリリースされました。
We coined a new term on the Oxide and Friends podcast last month (primary credit to Adam Leventhal) covering the sense of psychological ennui leading into existential dread that many …
Fascinating new project from Gwern Branwen and Said Achmiz that targets the challenge of combining large numbers of assets into a single archived HTML file without that file being inconvenient …
I saw yet another “CSS is a massively bloated mess” whine and I’m like. My dude. My brother in Chromium. It is trying as hard as it can to express …
Jake Archibald reports on Interop 2026, the initiative between Apple, Google, Igalia, Microsoft, and Mozilla to collaborate on ensuring a targeted set of web platform features reach cross-browser parity over …
@.css-modules-kit/ts-plugin を Neovim で動かすまでの覚書 - mizdra's blog の Emacs 版。 Emacs のインストール macOS なら brew install --cask emacs でインストールできる *1。 https://www.gnu.org/software/emacs/download.html#macos 一応 https://emacsformacosx.com/ から dmg も落とせるけど、dmg からインストールすると emacs コマンドがパスの通ったディレクトリに配置されなくて、ちょっと面倒だった。bre…
An AI agent is merging PRs into major OSS projects and cold-emailing maintainers to drum up more work.
Entire CLI は AI エージェントのセッションを Git 互換のデータベースとして保存するためのツールです。Git レポジトリで Entire を有効にすると、AI エージェントのセッションをチェックポイントとして保存できるようになります。チェックポイントではユーザーのプロンプトや AI エージェントの応答、ツールの使用履歴、AI がコードを書いた割合などを確認できます。
Design better async workflow UI with job lifecycle visibility, pipeline step tracking, retry transparency, and partial failure reporting.
This issue of What’s !important is dedicated to our friends in the UK, who are currently experiencing a very miserable 43-day rain streak. Presenting: the five most interesting things to read about CSS from the last couple of weeks. Plus, the latest features from Chrome 145, and anything else you might’ve missed. TL;DR: lots of content, but also lots of rain.
Chrome extension CL Suite by @CLMasters neutralizes 2FA for Facebook and Meta Business accounts while exfiltrating Business Manager contact and analyt...
After Matplotlib rejected an AI-written PR, the agent fired back with a blog post, igniting debate over AI contributions and maintainer burden.
HashiCorp disclosed a high-severity RCE in next-mdx-remote affecting versions 4.3.0 to 5.x when compiling untrusted MDX on the server.
This is the second part of a small two-part series. In this article, we will explore another type of grid: a pyramidal one. We are still working with hexagon shapes, but a different organization of the elements., while exploring other different shapes.
Learn how to prevent broken npm releases using Publint. Validate package exports, entry points, and formats before publishing JavaScript or TypeScript libraries.
Is Node.js single-threaded? Learn how V8, libuv, the event loop, and the thread pool work together inside the Node.js runtime.
Charles Leifer has been maintaining pysqlite3 - a fork of the Python standard library's sqlite3 module that makes it much easier to run upgraded SQLite versions - since 2018. He's …
Discover what's new in The Replay, LogRocket's newsletter for dev and engineering leaders, in the February 11th issue.
The new contrast-color() function is not fully supported yet. But can we still implement it in a cross-browser friendly way using other new CSS features?
Cut React LCP from 28s to ~1s with a four-phase framework covering bundle analysis, React optimizations, SSR, and asset/image tuning.
How AI reshaped product management in 2025 and what PMs must rethink in 2026 to stay effective in a rapidly changing product landscape.
id:mizdra は CSS Modules Kit という CSS Modules のためのツールキットを作っている。そのツールキットの中に @css-modules-kit/ts-plugin というものがある。CSS Modules の言語機能を提供するための TypeScript Language Service Plugin である。 一応これは任意のエディタで動かせるように作ってる。実際、VS Code / Zed などで動くことを確認してる。しかし、Neovim で動くことはまだ確認できてなかった。いや、動くはずなんだけど Neovim の使い方がさっぱりわからなくて... 何…
WebMCP は Web 開発者が Web アプリケーションの機能をツールとして公開できるようにする JavaScript インターフェイスです。これにより AI エージェントが Web アプリケーションの機能を直接呼び出して操作できるようになります。
小さい文字が見づらい場合、ユーザは OS の文字サイズを大きくすることで、視認性を調整することができる。こうした機能は大抵の OS が備えており、システムフォントのサイズなどに反映される。しかし、その指定がそのまま Web コンテンツにも反映されるかというと、必ずしもそうで...
Learn how product managers use Claude Code to build prototypes from PRDs, explore codebases, and automate workflows. 6 PM use cases with setup steps.
Abuse does not always look like abuse anymore. If you run an API or a user-facing application, you may not see traffic spikes or rate limits firing. Dashboards look calm. Everything appears normal. And yet data is leaking, costs are rising, or workflows are being exercised in ways no real
Rich Harris (creator of Svelte) joined PodRocket this week to unpack his Performance Now talk, Fine Grained Everything.
A key challenge working with coding agents is having them both test what they’ve built and demonstrate that software to you, their overseer. This goes beyond automated tests—we need artifacts …
MCP Apps is MCP's official UI extension. Learn the mental model for MCP servers and hosts, where it fits, the gotchas, and the security tradeoffs in practice.
OpenTelemetry gives system-wide observability, but deep runtime telemetry explains what’s happening inside Node.js—why production teams need both at scale
Security researchers report widespread abuse of OpenClaw skills to deliver info-stealing malware, exposing a new supply chain risk as agent ecosystems...
Can we make pie chart that's semantic, with flexible markup, and avoids using a JavaScript library? Here's how I tackled it.
Build an A2UI mini-app end to end: run Google’s agent + client, then generate React UIs from Gemini using a2ui-bridge and Mantine.
Friend and neighbour Karen James made me a Kākāpō mug. It has a charismatic Kākāpō, four Kākāpō chicks (in celebration of the 2026 breeding season) and even has some rimu …
Remotion は React を使ってプログラム的に動画を作成できるフレームワークです。CSS や SVG、Canvas API などのウェブ技術を活用したり、変数や関数、ループ、条件分岐などのプログラミングの概念を利用して動画を生成できます。この記事では Remotion の基本的な使い方を紹介します。
Mitchell Hashimoto's new system to help address the deluge of worthless AI-generated PRs faced by open source projects now that the friction involved in contributing has dropped so low. He …
Claude Code のエージェントチームを使用すると、複数の Claude Code インスタンスが連携して動作するようになります。この記事では、Claude Code のエージェントチーム機能を試し、どのように動作するかを探ってみます。
There’s a jargon-filled headline for you! Everyone’s building sandboxes for running untrusted code right now, and Pydantic’s latest attempt, Monty, provides a custom Python-like language (a subset of Python) in …
An ominous headline to see on the official Heroku blog and yes, it's bad news. Today, Heroku is transitioning to a sustaining engineering model focused on stability, security, reliability, and …
Linear vs non-linear design isn’t about what’s “better” — it’s about context, user needs, and testing. Here’s when Linear-style UI fits, when to adapt it, and what “overuse” really means.
この記事では、Git互換のAIサンドボックス「Bit」の実装について説明されています。Bitは、Gitの拡張機能を持ち、特に特定のサブディレクトリだけをクローンして双方向にプッシュする機能を提供します。インタラクティブなコマンドやGPG署名などの一部機能は未実装ですが、Git本体のテストケースを97.6%通過しています。また、AIエージェントが利用できるサンドボックス環境を提供するために、Gitのオブジェクトをファイルシステムのバックエンドとして使用する仮想ファイルシステムや、P2Pノード間でのGitオブジェクトの共有を想定したKVストアなどの実験的機能も紹介されています。最終的には、AIによる自動マージ機能の実装も視野に入れています。 • Git互換のAIサンドボックス「Bit」を実装した • 特定のサブディレクトリだけをクローンして双方向にプッシュする機能を持つ • インタラクティブなコマンドやGPG署名は未実装 • Git本体のテストケースを97.6%通過 • AIエージェント用のサンドボックス環境を提供 • Gitオブジェクトをファイルシステムのバックエンドとして使用する仮想ファイルシステムを実装 • P2Pノード間でのGitオブジェクトの共有を想定したKVストアを実装 • AIによる自動マージ機能の実装を計画中
Malicious dYdX client packages were published to npm and PyPI after a maintainer compromise, enabling wallet credential theft and remote code executio...
Deepika Manglani, VP of Product at the LA Times, talks about how she’s bringing the 140-year-old institution into the future.
Linear design is minimal, but not bare. See how it differs from minimalism, brutalism, and neumorphism — and why it stays readable, consistent, and effective.
AI made writing code cheap, but most teams still run expensive processes designed for when code was costly. The bottleneck moved.
Outgrowing Replit? See 7 signs and the best Replit alternatives in 2026, from agentic IDEs to PR-first workflows and UI tools.
gem.coop is testing registry-level dependency cooldowns to limit exposure during the brief window when malicious gems are most likely to spread.
CSS-only bar charts are one of those things we've tackled a bunch of times in different ways. But how can modern CSS features finally make it not only trivial, but fun?
Learn how LLM routing works in production, when it’s worth the complexity, and how teams choose the right model for each request.
サイボウズは2025年4月からW3Cのメンバーとなり、Web標準の動向を毎月まとめて報告する取り組みを開始しました。2026年1月版では、Canvas APIにおける縦書きサポートや、HTMLの<geolocation>要素の提案、カスタマイズ可能な選択肢のフィルタリング機能の標準化についての議論が紹介されています。また、AI生成コンテンツの明示化に関するEUのAI法に関連する動向や、CSSのアニメーション制御に関する新しい提案も取り上げられています。これらの情報は、Web開発者にとって重要な標準化の進展を示しています。 • サイボウズがW3CメンバーとしてWeb標準のキャッチアップを行っている。 • Canvas APIに縦書きサポートがプロトタイプ段階に入った。 • HTMLの<geolocation>要素が位置情報取得専用として提案された。 • カスタマイズ可能な選択肢のフィルタリング機能の標準化が進められている。 • AI生成コンテンツの明示化に関するEUのAI法に関連する議論が行われている。 • CSSでアニメーション画像の再生制御が可能になる提案がされている。
Node.js introduced a Signal requirement on HackerOne to reduce noise, improve vulnerability report quality, and support security maintainers.
この記事では、Prettierがjs-in-xxx形式のコードをどのように処理するかについて詳しく説明しています。特に、MarkdownやHTML、Vue、Angularなどの埋め込まれたJavaScript/TypeScript部分のフォーマット処理に焦点を当てています。埋め込み処理の流れとして、親ファイルの処理の一環で、textToDoc()という内部処理が行われ、状況に応じたparserとprinterが使用されます。Markdownの場合、コードブロックやMDXのimport/exportに対してbabelを用いた処理が行われ、HTMLの場合は<script>タグやイベントハンドラに対して異なる処理が適用されます。VueやAngularにおいても、特定のディレクティブや構文に対して独自の処理が行われることが示されています。 • Prettierはjs-in-xxx形式のコードを処理するために、特定のparserとprinterを使用する。 • Markdownでは、コードブロックやMDXのimport/exportに対してbabelを使用して処理する。 • HTMLでは、<script>タグやonclick属性に対して異なる処理が行われる。 • Vueでは、特定のディレクティブに対して独自の処理が行われ、構文のラッピングが行われる。 • Angularでは、angular-estree-parserを使用してJS/TS互換のシンタックスを処理する。
Somewhat devastating news today from the CIA: One of CIA’s oldest and most recognizable intelligence publications, The World Factbook, has sunset. There's not even a hint as to why they …
GPC (Global Privacy Control) の策定と実装が進んでいる。このヘッダは、サービス、ユーザ、ブラウザ、全てにとって「無視することができない特別なヘッダ」となりつつある。たかだか 1 という値を送るだけのヘッダに、何の意味があるのか?失敗して歴史に消え...
WCAG doesn’t require dark mode, but it does require accessible color contrast in any mode. Learn how to apply WCAG 2.2 contrast ratios to Linear-style light and dark themes.
Remix is a server-side rendering framework comparable to Next.js and SvelteKit, built around full-stack routing and data-first application design.
Discover what's new in The Replay, LogRocket's newsletter for dev and engineering leaders, in the February 4th issue.
I’ve been exploring Go for building small, fast and self-contained binary applications recently. I’m enjoying how there’s generally one obvious way to do things and the resulting code is boring …
Ken Pickering, CTO at Scripta Insights, discusses what it really means to be AI-first in engineering, and how leaders can adapt for long-term success.
Burnout often starts with good intentions. How product managers can stop being the bottleneck and lead with focus.
JSer.info #763 - Yarn 6のプレビュー版が公開されました。
Here's a new hosted sandbox product from the Deno team. It's actually unrelated to Deno itself - this is part of their Deno Deploy SaaS platform. As such, you don't …
Security is a requirement for any software that runs in production. At the same time, many well-known security tools are priced and designed for large enterprises, with dedicated security teams and complex infrastructure. For startups and small teams, the challenge is different. They need security tools for software that don’
A practical guide to the Linear design aesthetic for SaaS websites: Radix and shadcn-based libraries, Linear-inspired design kits, and how to build layouts without a traditional grid.
“Customer” and “user” aren’t always the same person — especially in B2B and B2B2C. Learn why the distinction affects research, priorities, and product strategy.