add .claude config folder with Claude-equivalent agent and hook settings

Mirrors .cursor and .codex structure with Claude model assignments:
- haiku for lighter tasks (translator, browser-check, profiler)
- sonnet for standard tasks (code-quality, plan-implementer, etc.)

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Tommaso Casaburi
2026-03-29 16:35:21 +07:00
co-authored by Claude Opus 4.6
parent e7d175afa1
commit 189d1c2165
101 changed files with 10859 additions and 1 deletions
@@ -0,0 +1,38 @@
---
title: CSS content-visibility for Long Lists
impact: HIGH
impactDescription: faster initial render
tags: rendering, css, content-visibility, long-lists
---
## CSS content-visibility for Long Lists
Apply `content-visibility: auto` to defer off-screen rendering.
**CSS:**
```css
.message-item {
content-visibility: auto;
contain-intrinsic-size: 0 80px;
}
```
**Example:**
```tsx
function MessageList({ messages }: { messages: Message[] }) {
return (
<div className="overflow-y-auto h-screen">
{messages.map(msg => (
<div key={msg.id} className="message-item">
<Avatar user={msg.author} />
<div>{msg.content}</div>
</div>
))}
</div>
)
}
```
For 1000 messages, browser skips layout/paint for ~990 off-screen items (10× faster initial render).