Wzorce kontekstu

Wzorce kontekstu

Kontekst to sekretny składnik rozwoju wspomaganego przez AI. Opanuj te wzorce, aby przekształcić mgliste odpowiedzi AI w precyzyjny, gotowy do produkcji kod. Naucz się dostarczać właśnie tyle kontekstu - nie za mało, nie za dużo.

Zrozumienie okien kontekstu

Czym jest okno kontekstu?

• Limit tokenów: Modele przetwarzają ~128k tokenów (≈10,000 linii kodu)
• Jakość vs ilość: Więcej kontekstu ≠ lepsze odpowiedzi
• Czynnik kosztów: Większy kontekst = wyższe koszty API
• Czas odpowiedzi: Więcej kontekstu = wolniejsze odpowiedzi

Wpływ kontekstu na jakość

Jakość kontekstu	Odpowiedź AI	Czas developera
Za mało	Ogólna, błędne założenia	Dużo przeróbek
Dokładnie tyle ile trzeba	Precyzyjna, dopasowana do kodu	Minimalne edycje
Za dużo	Zdezorientowana, wolna, droga	Debugowanie AI

Podstawowe wzorce kontekstu

Kontekst chirurgiczny

Precyzyjny, skupiony kontekst dla konkretnych zadań

Kontekst warstwowy

Buduj kontekst stopniowo dla złożonych zadań

Kontekst semantyczny

Użyj AI do automatycznego znajdowania odpowiedniego kontekstu

Kontekst skompresowany

Zmniejsz użycie tokenów zachowując znaczenie

Wzorzec 1: Kontekst chirurgiczny

Kiedy używać

• Szybkie poprawki i małe zmiany
• Operacje krytyczne dla wydajności
• Jasne, odizolowane problemy

Implementacja

# Źle: Podejście "wszystko naraz"
@folder src/  # 50,000 linii dołączonych
Napraw błąd logowania

# Dobrze: Precyzja chirurgiczna
@file src/auth/login.ts
@file src/auth/validation.ts
@code validateEmail  # konkretna funkcja
Napraw walidację email odrzucającą prawidłowe adresy ze znakiem +

Przykład z prawdziwego świata

JavaScript

// Kontekst: Tylko te konkretne elementy
@file utils/validation.js
@code EMAIL_REGEX
@code validateEmail

// Prompt
Zaktualizuj walidację email, aby akceptowała plus addressing (user+tag@domain.com)
Zachowaj istniejącą walidację dla innych reguł

Python

# Kontekst: Skoncentrowany na problemie
@file validators/email.py
@code EmailValidator.__init__
@code EmailValidator.validate

# Prompt
Dodaj obsługę subadresowania (+ tags) w walidacji email
Zachowaj zgodność z RFC 5322

Wzorzec 2: Warstwowe budowanie kontekstu

Podejście “cebulowe”

Zacznij wąsko, rozszerzaj w miarę potrzeb:

1. Warstwa podstawowa: Dokładny kod/plik z problemem
2. Warstwa integracyjna: Bezpośrednio połączony kod
3. Warstwa systemowa: Architektura i wzorce
4. Warstwa domenowa: Reguły biznesowe i wymagania

Przykład: Dodawanie funkcji płatności

## Warstwa 1: Skupienie podstawowe
@file models/Order.ts
@file models/Payment.ts

Zadanie: Dodaj przetwarzanie płatności do zamówień

## Warstwa 2: Dodaj kontekst integracyjny
@file services/PaymentService.ts
@file api/payments/webhook.ts

## Warstwa 3: Dodaj kontekst systemowy
@folder lib/payments/
@code PaymentProvider interface

## Warstwa 4: Dodaj kontekst domenowy
@file docs/payment-requirements.md
@docs Przewodnik integracji Stripe

Wzorzec 3: Semantyczne zbieranie kontekstu

Pozwól AI pomóc ci znaleźć odpowiedni kontekst:

Wzorzec odkrywania

# Krok 1: Poproś AI o znalezienie kontekstu
"Jakie pliki i funkcje obsługują uwierzytelnianie użytkowników w tej bazie kodu?"

# Krok 2: Przejrzyj ustalenia AI
# AI odpowiada z: auth/, middleware/auth.ts, utils/jwt.ts

# Krok 3: Użyj ustaleń jako kontekst
@file auth/login.ts
@file middleware/auth.ts
@code generateJWT

"Dodaj dwuetapowe uwierzytelnianie do procesu logowania"

Inteligentne zapytania kontekstowe

Typ zapytania	Przykład	Przypadek użycia
Architektura	”Pokaż mi wszystkie akcje Redux”	Zrozumienie wzorców
Zależności	”Co wywołuje UserService?”	Analiza wpływu
Podobny kod	”Znajdź implementacje paginacji”	Spójność
Wzorce błędów	”Gdzie obsługujemy błędy API?”	Obsługa błędów

Wzorzec 4: Kompresja kontekstu

Techniki zmniejszania użycia tokenów

1. Pliki podsumowujące

.cursor/summaries/auth-system.md

## Przegląd systemu uwierzytelniania
- Uwierzytelnianie oparte na JWT z tokenami odświeżania
- Role: admin, user, guest
- Timeout sesji: 24h
- Wymagania hasła: 8+ znaków, 1 specjalny

Kluczowe pliki:
- auth/login.ts - Główny przepływ logowania
- auth/jwt.ts - Generowanie tokenów
- middleware/auth.ts - Ochrona tras

2. Ekstrakcja interfejsów

// Zamiast dołączania całych plików implementacji
@file types/auth.d.ts  // Tylko interfejsy
@file api/auth/routes.ts  // Tylko definicje tras

3. Selektywne dołączanie

# Dołącz tylko publiczne metody
@code "class UserService" "public"
@code "export function" auth/utils.ts

Zaawansowane wzorce kontekstu

Kontekst multi-repozytoryjny

# Praca z wieloma repozytoriami
@folder ../shared-components/Button
@file ../api-server/src/endpoints/user.ts
@web https://api-docs.company.com/users

Upewnij się, że komponent Button pasuje do struktury odpowiedzi API

Kontekst historyczny

# Dołącz odpowiednią historię
@git PR #1234  # Poprzednia implementacja
@git commit abc123  # Kiedy funkcja została dodana
@docs decisions/adr-auth.md  # Decyzja architekturalna

Refaktoryzuj auth, aby rozwiązać problemy z PR #1234

Kontekst dynamiczny

# Kontekst zmieniający się w zależności od zadania
{{if FEATURE_FLAGS}}
  @file config/features.ts
  @code getFeatureFlag
{{/if}}

{{if DATABASE_CHANGE}}
  @file prisma/schema.prisma
  @folder migrations/
{{/if}}

Antywzorce kontekstu do unikania

Uwaga

Częste błędy kontekstu:

1. Wywrotka

   @folder src/  # 100,000 linii
   Napraw błąd gdzieś tutaj

2. Podróżnik w czasie

   @file old-implementation.backup.js
   @file new-implementation.js
   @file newer-implementation.js
   # Mylenie AI wieloma wersjami

3. Czytanie w myślach

   Napraw tę rzecz, o której rozmawialiśmy
   # Brak kontekstu o "tej rzeczy"

4. Maszyna do hałasu

   @file package-lock.json  # 30,000 linii
   @folder node_modules/  # Po co???

Mierzenie skuteczności kontekstu

Metryki jakości kontekstu

Metryka	Dobry kontekst	Słaby kontekst
Użycie tokenów	5-15k tokenów	50k+ tokenów
Czas odpowiedzi	2-5 sekund	20+ sekund
Dokładność	90%+ poprawne	poniżej 70% poprawne
Potrzeba iteracji	1-2	5+

Lista kontrolna optymalizacji kontekstu

• Trafność: Każdy plik/symbol bezpośrednio odnosi się do zadania
• Kompletność: Wszystkie niezbędne konteksty dołączone
• Przejrzystość: Jasne relacje między elementami kontekstu
• Wydajność: Minimalne tokeny dla maksymalnego zrozumienia
• Aktualność: Używanie najnowszych wersji plików

Wzorce kontekstu specyficzne dla technologii

React/Next.js

Kontekst rozwoju komponentów

# Minimalny kontekst dla nowego komponentu
@file components/ui/Button.tsx  # Wzorzec referencyjny
@file styles/theme.ts  # System projektowy
@code useTheme hook  # Integracja z tematami

Utwórz komponent Card zgodnie ze wzorcami Button

Kontekst zarządzania stanem

# Wzorzec kontekstu Redux/Zustand
@folder store/slices/  # Zobacz wzorce
@file store/types.ts  # Definicje typów
@code specific slice only

Node.js/Express

Kontekst endpointu API

# Kontekst endpointu RESTful
@file routes/users.js  # Wzorzec referencyjny
@file middleware/auth.js  # Wzorzec auth
@file validators/user.js  # Walidacja
@code specific route only

Dodaj endpoint DELETE /users/:id

Kontekst bazy danych

# Minimalny kontekst DB
@file models/User.js  # Tylko schemat
@code specific query functions
@file db/migrations/latest.sql

Python

Kontekst rozwoju klas

# Kontekst klasy Python
@file models/base.py  # Wzorce bazowe
@code AbstractModel class
@file models/user.py  # Przykład

Utwórz model Product zgodnie ze wzorcami

Kontekst testowania

# Wzorzec kontekstu testów
@file tests/test_user.py  # Wzorce testów
@file src/user.py  # Implementacja
@code specific test class

Przepływy pracy wzorców kontekstu

Przepływ 1: Badanie błędów

1. Zacznij od kontekstu błędu
   @error "TypeError: Cannot read property 'name'"
   @file src/components/UserCard.tsx

2. Rozszerz na przepływ danych
   @code getUserData
   @file api/users.ts

3. Dodaj kontekst typów w razie potrzeby
   @file types/User.ts

Przepływ 2: Implementacja funkcji

1. Kontekst wymagań
   @file specs/feature-x.md
   @figma design-link

2. Kontekst wzorców
   @file similar-feature.ts
   @folder patterns/

3. Kontekst integracji
   @file routes/index.ts
   @file types/index.ts

Przepływ 3: Refaktoryzacja

1. Aktualna implementacja
   @file old-service.ts
   @code specific methods

2. Docelowy wzorzec
   @file patterns/service-template.ts
   @docs architecture/services.md

3. Kontekst testów
   @file tests/old-service.test.ts

Wskazówki pro dla mistrzostwa kontekstu

1. Buduj szablony kontekstu

   • Twórz wielokrotnego użytku wzorce kontekstu dla typowych zadań
   • Przechowuj w .cursor/contexts/

2. Używaj aliasów kontekstu

   # Zdefiniuj raz, używaj wielokrotnie
   AUTH_CONTEXT = @file auth/* @code JWT*
   
   Używając AUTH_CONTEXT, dodaj rotację tokenów odświeżania

3. Progresywne wzbogacanie

   • Zacznij minimalnie
   • Dodawaj kontekst na podstawie pytań AI
   • Usuwaj nieistotny kontekst

4. Komentarze kontekstu

   @file api/user.ts  # Aktualna implementacja
   @file api/user.v2.ts  # Docelowy wzorzec
   @docs api-standards.md  # Musi przestrzegać tych

Następne kroki

Opanuj te wzorce kontekstu, aby:

• Zmniejszyć czas rozwoju o 40-60%
• Poprawić dokładność odpowiedzi AI do 90%+
• Obniżyć koszty API optymalizując użycie tokenów
• Pewnie obsługiwać złożone zmiany wieloplikowe

Kontynuuj z:

• Zarządzanie fragmentami kodu - Wzorce kodu wielokrotnego użytku
• Przepływy debugowania - Kontekst dla polowania na błędy
• Wzorce testowania - Strategie kontekstu specyficzne dla testów

Pamiętaj: Kontekst to sygnał, nie szum. Każdy element kontekstu powinien zasłużyć na swoje miejsce, bezpośrednio przyczyniając się do lepszego zrozumienia AI.