Verbeter mijn Cursor-code-analyse met AI-gegenereerde best practices
description
Met deze prompt krijg je gerichte, door AI gegenereerde best practices die helpen je code te verbeteren en te moderniseren. Het lost problemen op zoals verouderde code, inconsistenties en inefficiënties. Het is beter dan alternatieven doordat het direct inspeelt op jouw code en programmeertaal, waardoor je sneller en gerichter verbeteringen doorvoert.
prompt
Help me mijn code te analyseren met Cursor en geef AI-gegenereerde best practices voor mijn programmeertaal: <voer je programmeertaal in>. Plak hier de code die ...
try_prompt
generate_helper
disclaimerOnPageApi
tags
ai_answers
provider: openai
model: gpt-4.1-nano
Hier is een overzicht van je code met suggesties voor optimalisatie en best practices in JavaScript:
**Analyseren van je code:**
- De functie `fetchData` haalt data op van een gegeven URL en retourneert de parsed JSON.
- Het gebruikt de `.then()` methode, wat correct is, maar kan worden verbeterd door modernere async/await syntax voor meer leesbaarheid.
**Verbeteringen en aanbevelingen:**
1. **Gebruik van async/await:**
- Maak de functie asynchroon met `async`.
- Gebruik `await` voor de fetch en JSON parsing, wat de code overzichtelijker maakt.
2. **Foutafhandeling:**
- Voeg foutafhandeling toe met `try/catch` om netwerk- of parsingfouten op te vangen.
3. **Return type en documentatie:**
- Overweeg documentatie of typeaanduidingen (bijvoorbeeld met JSDoc) voor duidelijkheid.
4. **Modulariteit:**
- Houd functies klein en herbruikbaar.
**Voorbeeld van een verbeterde versie:**
```javascript
/**
* Haalt data op van de gegeven URL en retourneert de JSON-inhoud.
* @param {string} url - De URL om data van op te halen.
* @returns {Promise<any>} - Een belofte die de opgehaalde gegevens bevat.
*/
async function fetchData(url) {
try {
const response = await fetch(url);
if (!response.ok) {
throw new Error(`HTTP-fout! Status: ${response.status}`);
}
const data = await response.json();
return data;
} catch (error) {
console.error('Fout bij ophalen van data:', error);
throw error; // Doorgeven van de fout voor verdere afhandeling
}
}
```
**Moderne technieken en best practices:**
- Gebruik `async/await` voor betere leesbaarheid.
- Controleer de response status (`response.ok`) voordat je JSON parseert.
- Voeg foutafhandeling toe om problemen te beheren.
- Documenteer je functies voor betere onderhoudbaarheid.
**Kort samengevat:**
- Converteer naar `async` functie.
- Voeg foutafhandeling toe.
- Controleer response status.
- Gebruik moderne syntax voor overzichtelijkheid.
Wil je dat ik je nog help met verdere optimalisaties of uitleg over bepaalde technieken?
provider: deepseek
model: deepseek-chat
Zeker, ik help je graag met het analyseren en optimaliseren van je JavaScript code. Hier is een gedetailleerde analyse en verbeteringsvoorstellen:
## Analyse van je huidige code
Je huidige functie is een goede basis, maar kan op verschillende punten worden verbeterd.
## Verbeterde versie met moderne technieken
```javascript
// Optie 1: Met async/await (aanbevolen)
async function fetchData(url, options = {}) {
try {
const response = await fetch(url, {
headers: {
'Content-Type': 'application/json',
...options.headers
},
...options
});
if (!response.ok) {
throw new Error(`HTTP-fout! status: ${response.status}`);
}
return await response.json();
} catch (error) {
console.error('Fout bij ophalen data:', error);
throw error; // Herwerp de fout voor afhandeling door de aanroeper
}
}
// Optie 2: Met fetch API met betere error handling
const fetchData = async (url, options = {}) => {
const controller = new AbortController();
const timeoutId = setTimeout(() => controller.abort(), 10000); // 10 seconden timeout
try {
const response = await fetch(url, {
signal: controller.signal,
...options
});
clearTimeout(timeoutId);
if (!response.ok) {
throw new Error(`HTTP ${response.status}: ${response.statusText}`);
}
return await response.json();
} catch (error) {
clearTimeout(timeoutId);
if (error.name === 'AbortError') {
throw new Error('Request timeout: De server reageerde niet op tijd');
}
throw error;
}
};
```
## Best practices en verbeteringen
### 1. **Error Handling**
```javascript
// Gebruik try-catch voor betrouwbare error handling
async function fetchDataWithRetry(url, maxRetries = 3) {
for (let attempt = 1; attempt <= maxRetries; attempt++) {
try {
return await fetchData(url);
} catch (error) {
if (attempt === maxRetries) throw error;
await new Promise(resolve => setTimeout(resolve, 1000 * attempt)); // Exponentiële backoff
}
}
}
```
### 2. **Type Safety en Validatie**
```javascript
function fetchData(url, options = {}) {
// Input validatie
if (typeof url !== 'string' || !url.trim()) {
throw new Error('Ongeldige URL opgegeven');
}
if (options && typeof options !== 'object') {
throw new Error('Options moet een object zijn');
}
// URL validatie
try {
new URL(url);
} catch {
throw new Error('Ongeldige URL format');
}
return fetch(url, options)
.then(response => {
if (!response.ok) throw new Error(`HTTP ${response.status}`);
return response.json();
});
}
```
### 3. **Moderne JavaScript Features**
```javascript
// Gebruik van destructuring en default parameters
const fetchData = async (
url,
{
headers = {},
timeout = 10000,
retries = 3
} = {}
) => {
// Implementatie hier
};
// Gebruik van arrow functions voor consistentie
const validateUrl = (url) => {
try {
return Boolean(new URL(url));
} catch {
return false;
}
};
```
### 4. **Performance Optimalisaties**
```javascript
// Cache mechanisme
const cache = new Map();
const fetchDataWithCache = async (url, options = {}) => {
const cacheKey = JSON.stringify({ url, options });
if (cache.has(cacheKey)) {
return cache.get(cacheKey);
}
const data = await fetchData(url, options);
cache.set(cacheKey, data);
// Auto-verwijdering na 5 minuten
setTimeout(() => cache.delete(cacheKey), 300000);
return data;
};
```
## Code Kwaliteitsrichtlijnen
### 1. **Consistentie**
- Gebruik ofwel `async/await` ofwel Promises, niet beide door elkaar
- Houd je aan een consistente naamgevingsconventie (camelCase)
- Gebruik semicolons of niet, maar wees consistent
### 2. **Documentatie**
```javascript
/**
* Haalt data op van een specifieke URL met geavanceerde error handling
* @param {string} url - De URL om data van op te halen
* @param {Object} options - Fetch opties (optioneel)
* @param {number} options.timeout - Timeout in milliseconden (standaard: 10000)
* @returns {Promise<any>} De opgehaalde JSON data
* @throws {Error} Bij network errors of HTTP fouten
*/
async function fetchData(url, options = {}) {
// Implementatie
}
```
### 3. **Testbaarheid**
```javascript
// Maak functies testbaar door dependencies te injecteren
const createDataFetcher = (fetchImplementation = fetch) => {
return async (url, options) => {
const response = await fetchImplementation(url, options);
if (!response.ok) throw new Error(`HTTP ${response.status}`);
return response.json();
};
};
// Gebruik in productie
const fetchData = createDataFetcher();
// Gebruik in tests
const mockFetch = jest.fn();
const testFetcher = createDataFetcher(mockFetch);
```
## Aanvullende tips voor Cursor
1. **Gebruik Cursor's AI features** om:
- Code reviews uit te voeren op je volledige codebase
- Automatische refactoring voorstellen te genereren
- Test cases te laten schrijven voor je functies
2. **Implementeer TypeScript** voor betere type safety:
```typescript
interface FetchOptions extends RequestInit {
timeout?: number;
}
async function fetchData<T>(url: string, options: FetchOptions = {}): Promise<T> {
// Implementatie met type safety
}
```
3. **Gebruik ESLint en Prettier** voor consistente code style
Deze verbeteringen maken je code robuuster, onderhoudbaarder en schaalbaarder. Wil je dat ik specifieke onderdelen verder uitwerk of aanvullende voorbeelden geef?