yjs-best-practices

Diagnose and resolve Yjs import, subdocument, and encoding issues in collaborative applications.

Updated Sep 19, 2026
One-click install
npx skills add https://github.com/paramcodes/autobro --skill yjs-best-practices-paramcodes
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: yjs-best-practices
Source: https://github.com/paramcodes/autobro/tree/main/.agents/skills/yjs-best-practices
Command: npx skills add https://github.com/paramcodes/autobro --skill yjs-best-practices-paramcodes

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires yjs, y-utility, @liveblocks/react, @liveblocks/yjs.

What problem does it solve? Yjs applications frequently suffer from duplicate imports, bloated documents from inefficient Y.Map usage, and unnecessary subdocument complexity, causing synchronization bugs and performance degradation that are hard to diagnose. ## Core Features & Use Cases - Duplicate Import Detection: Identifies and fixes double Yjs imports caused by CJS/ESM mixing or bundler duplication using package manager resolutions and bundler aliases. - Document Structure Guidance: Explains when to avoid subdocuments and use Y.Map instead, and when to replace Y.Map with YKeyValue from y-utility for efficient key-value storage. - V2 Encoding Configuration: Shows how to enable experimental V2 encoding with Liveblocks for smaller document sizes and reduced bandwidth. - Use Case: When your collaborative editor shows a Yjs duplicate-import warning in the console or your document grows to hundreds of kilobytes from frequent key updates, use this Skill to pinpoint the cause and apply the correct fix. ## Quick Start Ask the AI to review your Yjs setup for duplicate imports and recommend whether to use Y.Map, YKeyValue, or subdocuments for your data model.

Frequently Asked Questions about yjs-best-practices

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I fix duplicate Yjs imports in my application?▼

Duplicate Yjs imports are fixed by forcing a single version through package manager resolutions. Add a resolutions field in package.json for npm or yarn, or pnpm overrides for pnpm, and configure bundler aliases so only one Yjs instance is bundled.

Y.Map vs YKeyValue for key-value storage in Yjs?▼

YKeyValue from the y-utility package is more efficient than Y.Map for frequently updated keys because document size depends only on map size, not operation history. Benchmarks show 100k operations on 10 keys shrinking from 524KB with Y.Map to 271 bytes with YKeyValue.

When should I use Yjs subdocuments?▼

Use Yjs subdocuments only when you have multiple very large documents in the same room or need to lazy-load documents individually. For most cases, including multiple text editors on one page, a Y.Map organizing shared types is simpler and performs better.

Why does my Yjs document keep growing in size?▼

Yjs documents grow because Y.Map retains all historical key values to resolve conflicts, and alternating updates to different keys break its optimization. Switching to YKeyValue from y-utility keeps document size proportional to the data, not the operation count.

Does Yjs V2 encoding work with all clients?▼

Yjs experimental V2 encoding requires all connected clients to enable the same option, such as useV2Encoding_experimental in the Liveblocks Yjs provider. Clients with mismatched settings will not understand each other's changes.