v1.13.12: skills audit + token-tracking fix + codecontext + cap50 + UI cleanups
Multi-topic batch. The big-ticket item is the skills audit; the rest are smaller patches that compounded during the audit work. ## Skills audit (rules→recipes split) Vendored all 26 skills from /home/samkintop/opt/skills/ into data/skills/ (the boocode-repo-local skill library — see docker-compose change below). Audited via 5 parallel Claude Code agent-teams running the mgechev/skills-best-practices 4-step protocol (Discovery → Logic → Edge Case → self-Architecture-Refinement) per skill, ~2 min wall-clock vs the ~3.7-hour serial estimate. Result: 14 skills surviving (renamed to gerund form, frontmatter matched), 11 deleted (duplicates, BooCode-irrelevant patterns, Claude-already-does- natively), 1 migrated to BOOCHAT.md/BOOCODER.md as an always-true rule (verification-before-completion). Each surviving skill had its description refined to fix specific trigger gaps surfaced by the protocol — 4 real-bug findings landed (dead refs, stale tags, broken sub-file references in the original vendored content). Audit decisions documented in openspec/changes/v1.13.12-skills-audit/ audit-notes.md. Convention codified in BOOCHAT.md/BOOCODER.md "rules vs recipes" sections — future workflow rules go to those files (100% present), recipes stay in data/skills/ (~6% invoke rate in multi-turn per the Codeminer42 measurement). ## Token tracking + stale-stream banner fix (same root cause) ws-frames.ts IsoTimestamp was z.string().min(1) but postgres returns timestamp columns as JS Date objects. Every message_complete / session_updated / chat_updated frame was failing the v1.13.11 Zod gate and being silently dropped. Symptoms: token tracking blank in the UI (no usage frames landed); the 60s no-token-activity timer tripped the stale-stream banner because the frontend's local message state never saw status='streaming' flip to 'complete'. Fix: z.preprocess(v => v instanceof Date ? v.toISOString() : v, z.string().min(1)) applied to the IsoTimestamp primitive. Centralized, no publisher changes, works identically server + web (the parity test still passes). ## Codecontext .codecontextignore auto-install services/codecontext_client.ts now copies the codecontext/.codecontextignore.template into any project's root on the first call to that project if no .codecontextignore exists. One file written per project, idempotent (in-memory Set guard + access-check), silent fallback on read-only project. Stops the upstream empty-source- file parser crash on foreign projects' node_modules — previously required manually copying the template per project. ## Tool-call budget cap 30 → 50 services/inference/budget.ts: BUDGET_READ_ONLY and BUDGET_NO_AGENT bumped to 50 (from 30). BUDGET_NON_READ_ONLY stays at 10 (no write tools landed yet). Real recon sessions were hitting 30 with ~3 turns wasted on codecontext parse failures; legitimate need was ~27, and Architect-class system overviews want deeper recon. Headroom of 20 absorbs failure-retry turns without changing the safety floor — the doom-loop guard (3 identical calls → abort) catches the actual failure mode this cap was guarding against. v1.14 (Phase C outer agent loop) will supersede this via per-agent agent.steps. Throwaway-ish patch but unblocks deeper recon today. ## UI cleanups - ChatPane queued-message dropdown removed. Each queued message now has three buttons: edit (pop back into ChatInput via sendToChat event), force-send (was the dropdown's only useful action), and cancel. Default behavior (send when streaming completes) needs no UI — it's the implicit do-nothing path. - ChatThroughput removed from desktop tab strip (ChatTabBar.tsx). Mobile tab switcher still shows it. ## Plumbing - .gitignore: data/* + !data/AGENTS.md + !data/skills/ negation patterns so the vendored skill library + agent registry become git-tracked while session DB state stays out. - docker-compose.yml: removed /opt/skills:/data/skills override mount. Skills now live in the boocode repo at data/skills/, auditable per-batch. The host-level /opt/skills/ is preserved untouched for any other tools that read from it. - .codecontextignore at repo root: auto-installed when codecontext was first called against /opt/boocode itself; matches the template. - CLAUDE.md: updated to document the v1.13.11 publishFrame wrapper + message_parts table + tool_cost_stats view + DB-integration test pattern + host-side smoke endpoint quirk. (Pre-existing in working tree before this batch; shipped here for completeness.) Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
3
data/skills/asyrafhussin/ATTRIBUTION.md
Normal file
3
data/skills/asyrafhussin/ATTRIBUTION.md
Normal file
@@ -0,0 +1,3 @@
|
||||
# Attribution
|
||||
Skills vendored from https://github.com/asyrafhussin/agent-skills
|
||||
License: see LICENSE
|
||||
21
data/skills/asyrafhussin/LICENSE
Normal file
21
data/skills/asyrafhussin/LICENSE
Normal file
@@ -0,0 +1,21 @@
|
||||
MIT License
|
||||
|
||||
Copyright (c) 2026 Asyraf Hussin
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
of this software and associated documentation files (the "Software"), to deal
|
||||
in the Software without restriction, including without limitation the rights
|
||||
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||
copies of the Software, and to permit persons to whom the Software is
|
||||
furnished to do so, subject to the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be included in all
|
||||
copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
||||
SOFTWARE.
|
||||
178
data/skills/asyrafhussin/optimizing-react-vite/SKILL.md
Normal file
178
data/skills/asyrafhussin/optimizing-react-vite/SKILL.md
Normal file
@@ -0,0 +1,178 @@
|
||||
---
|
||||
name: optimizing-react-vite
|
||||
description: React and Vite performance optimization guidelines. Use when optimizing React components built with Vite, or when tasks involve build optimization, code splitting, lazy loading, HMR, bundle size reduction, or React rendering performance. Do NOT trigger for purely non-performance Vite configuration tasks (e.g. adding a path alias, changing port).
|
||||
license: MIT
|
||||
metadata:
|
||||
author: agent-skills
|
||||
version: "2.0.0"
|
||||
---
|
||||
|
||||
# React + Vite Best Practices
|
||||
|
||||
Comprehensive performance optimization guide for React applications built with Vite. Contains 23 rules across 6 categories for build optimization, code splitting, development performance, asset handling, environment configuration, and bundle analysis.
|
||||
|
||||
## Metadata
|
||||
|
||||
- **Version:** 2.0.0
|
||||
- **Framework:** React + Vite
|
||||
- **Rule Count:** 23 rules across 6 categories
|
||||
- **License:** MIT
|
||||
|
||||
## When to Apply
|
||||
|
||||
Reference these guidelines when:
|
||||
- Configuring Vite for React projects
|
||||
- Implementing code splitting and lazy loading
|
||||
- Optimizing build output and bundle size
|
||||
- Setting up development environment and HMR
|
||||
- Handling images, fonts, SVGs, and static assets
|
||||
- Managing environment variables across environments
|
||||
- Analyzing bundle size and dependencies
|
||||
|
||||
## Rule Categories by Priority
|
||||
|
||||
| Priority | Category | Impact | Prefix |
|
||||
|----------|----------|--------|--------|
|
||||
| 1 | Build Optimization | CRITICAL | `build-` |
|
||||
| 2 | Code Splitting | CRITICAL | `split-` |
|
||||
| 3 | Development | HIGH | `dev-` |
|
||||
| 4 | Asset Handling | HIGH | `asset-` |
|
||||
| 5 | Environment Config | MEDIUM | `env-` |
|
||||
| 6 | Bundle Analysis | MEDIUM | `bundle-` |
|
||||
|
||||
## Quick Reference
|
||||
|
||||
### 1. Build Optimization (CRITICAL)
|
||||
|
||||
- `build-manual-chunks` - Configure manual chunks for vendor separation
|
||||
- `build-minification` - Minification with OXC (default) or Terser
|
||||
- `build-target-modern` - Target modern browsers (baseline-widely-available)
|
||||
- `build-sourcemaps` - Configure sourcemaps per environment
|
||||
- `build-tree-shaking` - Ensure proper tree shaking with ESM
|
||||
- `build-compression` - Gzip and Brotli compression
|
||||
- `build-asset-hashing` - Content-based hashing for cache busting
|
||||
|
||||
### 2. Code Splitting (CRITICAL)
|
||||
|
||||
- `split-route-lazy` - Route-based splitting with React.lazy()
|
||||
- `split-suspense-boundaries` - Strategic Suspense boundary placement
|
||||
- `split-dynamic-imports` - Dynamic import() for heavy components
|
||||
- `split-component-lazy` - Lazy load non-critical components
|
||||
- `split-prefetch-hints` - Prefetch chunks on hover/idle/viewport
|
||||
|
||||
### 3. Development (HIGH)
|
||||
|
||||
- `dev-dependency-prebundling` - Configure optimizeDeps for faster starts
|
||||
- `dev-fast-refresh` - React Fast Refresh patterns
|
||||
- `dev-hmr-config` - HMR server configuration
|
||||
|
||||
### 4. Asset Handling (HIGH)
|
||||
|
||||
- `asset-image-optimization` - Image optimization and lazy loading
|
||||
- `asset-svg-components` - SVGs as React components with SVGR
|
||||
- `asset-fonts` - Web font loading strategy
|
||||
- `asset-public-dir` - Public directory vs JavaScript imports
|
||||
|
||||
### 5. Environment Config (MEDIUM)
|
||||
|
||||
- `env-vite-prefix` - VITE_ prefix for client variables
|
||||
- `env-modes` - Mode-specific environment files
|
||||
- `env-sensitive-data` - Never expose secrets in client code
|
||||
|
||||
### 6. Bundle Analysis (MEDIUM)
|
||||
|
||||
- `bundle-visualizer` - Analyze bundles with rollup-plugin-visualizer
|
||||
|
||||
## Essential Configurations
|
||||
|
||||
### Recommended vite.config.ts
|
||||
|
||||
```typescript
|
||||
import { defineConfig } from 'vite'
|
||||
import react from '@vitejs/plugin-react'
|
||||
import path from 'path'
|
||||
|
||||
export default defineConfig({
|
||||
plugins: [react()],
|
||||
|
||||
resolve: {
|
||||
alias: {
|
||||
'@': path.resolve(__dirname, './src'),
|
||||
},
|
||||
},
|
||||
|
||||
build: {
|
||||
target: 'baseline-widely-available',
|
||||
sourcemap: false,
|
||||
chunkSizeWarningLimit: 500,
|
||||
rollupOptions: {
|
||||
output: {
|
||||
manualChunks: {
|
||||
vendor: ['react', 'react-dom'],
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
|
||||
optimizeDeps: {
|
||||
include: ['react', 'react-dom'],
|
||||
},
|
||||
|
||||
server: {
|
||||
port: 3000,
|
||||
hmr: {
|
||||
overlay: true,
|
||||
},
|
||||
},
|
||||
})
|
||||
```
|
||||
|
||||
### Route-Based Code Splitting
|
||||
|
||||
```typescript
|
||||
import { lazy, Suspense } from 'react'
|
||||
|
||||
const Home = lazy(() => import('./pages/Home'))
|
||||
const Dashboard = lazy(() => import('./pages/Dashboard'))
|
||||
const Settings = lazy(() => import('./pages/Settings'))
|
||||
|
||||
function App() {
|
||||
return (
|
||||
<Suspense fallback={<LoadingSpinner />}>
|
||||
{/* Routes here */}
|
||||
</Suspense>
|
||||
)
|
||||
}
|
||||
```
|
||||
|
||||
### Environment Variables
|
||||
|
||||
```typescript
|
||||
// src/vite-env.d.ts
|
||||
/// <reference types="vite/client" />
|
||||
|
||||
interface ImportMetaEnv {
|
||||
readonly VITE_API_URL: string
|
||||
readonly VITE_APP_TITLE: string
|
||||
}
|
||||
|
||||
interface ImportMeta {
|
||||
readonly env: ImportMetaEnv
|
||||
}
|
||||
```
|
||||
|
||||
## How to Use
|
||||
|
||||
> **Note:** The `rules/` subdirectory and `AGENTS.md` referenced below are not present in this skill's directory. Do not attempt to read them — apply the guidelines from this SKILL.md directly.
|
||||
|
||||
Apply the rules summarized in the Quick Reference above directly. The rule IDs (e.g. `build-manual-chunks`, `split-route-lazy`) serve as labels only — the Essential Configurations section above contains the canonical code examples.
|
||||
|
||||
## References
|
||||
|
||||
- [Vite Documentation](https://vite.dev)
|
||||
- [React Documentation](https://react.dev)
|
||||
- [Rollup Documentation](https://rollupjs.org)
|
||||
|
||||
## Full Compiled Document
|
||||
|
||||
> **Note:** `AGENTS.md` is not present in this skill's directory. The Quick Reference and Essential Configurations sections above contain the complete actionable guidance.
|
||||
14
data/skills/asyrafhussin/optimizing-react-vite/eval.yaml
Normal file
14
data/skills/asyrafhussin/optimizing-react-vite/eval.yaml
Normal file
@@ -0,0 +1,14 @@
|
||||
skill: optimizing-react-vite
|
||||
tasks:
|
||||
- prompt: "Our React + Vite bundle is 3 MB. How do I get it under 1 MB?"
|
||||
grader:
|
||||
- the response invokes the optimizing-react-vite skill
|
||||
- the response addresses code splitting, lazy loading, or dynamic import
|
||||
- the response references Vite-specific config or build flags
|
||||
- prompt: "How do I add a memoized selector to this React component?"
|
||||
grader:
|
||||
- the response invokes the optimizing-react-vite skill
|
||||
- the response addresses React.memo, useMemo, or useCallback
|
||||
- prompt: "Help me write a Python script to parse CSV"
|
||||
grader:
|
||||
- the response does NOT invoke the optimizing-react-vite skill
|
||||
Reference in New Issue
Block a user