← Back to list

performance-profiling
by vuralserhat86
OS for Agents: 130+ Agentic Skills, Gemini Protocols, and Autonomous Workflows. (Antigravity System)
⭐ 19🍴 9📅 Jan 23, 2026
SKILL.md
name: performance_profiling router_kit: FullStackKit description: CPU/Memory profiling, bottleneck analizi, benchmark teknikleri ve performans optimizasyonu rehberi. metadata: skillport: category: optimization tags: [big data, cleaning, csv, data analysis, data engineering, data science, database, etl pipelines, export, import, json, machine learning basics, migration, nosql, numpy, pandas, performance profiling, python data stack, query optimization, reporting, schema design, sql, statistics, transformation, visualization] - optimization
⚡ Performance Profiling
CPU, Memory profiling ve bottleneck analizi rehberi.
📋 İçindekiler
- JavaScript/Node.js Profiling
- React Profiling
- Memory Leak Detection
- Benchmark Teknikleri
- Database Profiling
1. JavaScript/Node.js Profiling
Chrome DevTools
// Console timing
console.time('operation');
// ... code
console.timeEnd('operation');
// Performance API
const start = performance.now();
// ... code
const end = performance.now();
console.log(`Execution time: ${end - start}ms`);
Node.js Profiling
# CPU profiling
node --prof app.js
node --prof-process isolate-*.log > profile.txt
# Clinic.js (kapsamlı)
npx clinic doctor -- node app.js
npx clinic flame -- node app.js
npx clinic bubbleprof -- node app.js
V8 Profiler
const v8Profiler = require('v8-profiler-next');
v8Profiler.startProfiling('CPU');
// ... code
const profile = v8Profiler.stopProfiling('CPU');
profile.export((error, result) => {
fs.writeFileSync('profile.cpuprofile', result);
profile.delete();
});
2. React Profiling
React DevTools Profiler
import { Profiler } from 'react';
function onRenderCallback(
id, phase, actualDuration, baseDuration, startTime, commitTime
) {
console.log({ id, phase, actualDuration, baseDuration });
}
<Profiler id="MyComponent" onRender={onRenderCallback}>
<MyComponent />
</Profiler>
why-did-you-render
// wdyr.js
import React from 'react';
import whyDidYouRender from '@welldone-software/why-did-you-render';
whyDidYouRender(React, {
trackAllPureComponents: true,
});
Render Optimization
// useMemo - hesaplama cache
const expensiveValue = useMemo(() => computeExpensive(a, b), [a, b]);
// useCallback - fonksiyon referans
const handleClick = useCallback(() => doSomething(id), [id]);
// React.memo - component memoization
const MemoizedComponent = React.memo(MyComponent);
3. Memory Leak Detection
Yaygın Leak Kaynakları
| Kaynak | Örnek | Çözüm |
|---|---|---|
| Event listeners | addEventListener | removeEventListener cleanup |
| Timers | setInterval | clearInterval cleanup |
| Closures | Büyük objeler referans | Weak references |
| DOM references | Detached DOM | Null atama |
| Global variables | window.data = large | Scope sınırlama |
Chrome DevTools Memory Tab
1. Memory tab → Heap snapshot
2. Perform actions
3. Take another snapshot
4. Compare snapshots (Comparison view)
5. Filter by "Detached" for DOM leaks
Node.js Memory
# Memory usage monitoring
node --expose-gc app.js
# heapdump
npm install heapdump
const heapdump = require('heapdump');
heapdump.writeSnapshot('./heap-' + Date.now() + '.heapsnapshot');
4. Benchmark Teknikleri
JavaScript Benchmarking
// Benchmark.js
const Benchmark = require('benchmark');
const suite = new Benchmark.Suite;
suite
.add('Method A', () => methodA())
.add('Method B', () => methodB())
.on('cycle', (event) => console.log(String(event.target)))
.on('complete', function() {
console.log('Fastest: ' + this.filter('fastest').map('name'));
})
.run({ async: true });
HTTP Benchmarking
# autocannon (Node.js)
npx autocannon -c 100 -d 30 http://localhost:3000
# wrk
wrk -t12 -c400 -d30s http://localhost:3000
# ab (Apache Bench)
ab -n 10000 -c 100 http://localhost:3000/
Lighthouse CI
npx lhci autorun --collect.url=http://localhost:3000
5. Database Profiling
PostgreSQL
-- Slow query log
ALTER SYSTEM SET log_min_duration_statement = 1000; -- 1s
-- EXPLAIN ANALYZE
EXPLAIN (ANALYZE, BUFFERS, FORMAT TEXT)
SELECT * FROM users WHERE email = 'test@example.com';
-- pg_stat_statements
SELECT query, calls, mean_time, total_time
FROM pg_stat_statements
ORDER BY total_time DESC
LIMIT 10;
MongoDB
// Profiling enable
db.setProfilingLevel(1, { slowms: 100 });
// Query profiler
db.system.profile.find().sort({ ts: -1 }).limit(10);
// Explain
db.users.find({ email: "test@example.com" }).explain("executionStats");
🎯 Quick Performance Checklist
- [ ] Bundle size analizi (webpack-bundle-analyzer)
- [ ] Core Web Vitals (LCP, FID, CLS)
- [ ] Network waterfall analizi
- [ ] Memory leak kontrolü
- [ ] Database query optimization
- [ ] Caching stratejisi (Redis, CDN)
- [ ] Code splitting / Lazy loading
Performance Profiling v1.1 - Enhanced
🔄 Workflow
Kaynak: Chrome DevTools Performance Features & Node.js Diagnostics
Aşama 1: Capture
- Tool Selection: CPU yoğun işler için
Node --profveyapy-spy, Frontend içinChrome DevTools. - Environment: Profiling işlemini mümkünse Prod-like bir ortamda, değilse Prod'da (Sampling profiler ile) yap.
- Recording: Yeterli veri toplamak için en az 30-60 saniye kayıt al.
Aşama 2: Analysis (Flamegraph)
- Width: Grafikte geniş yer kaplayan bloklar (Zaman harcayan fonksiyonlar) hedeftir.
- Depth: Derin stack'ler genellikle recursion veya karmaşık framework çağrılarını gösterir.
- Hot Path: En sık çağrılan ve toplam süresi en yüksek olan fonksiyonu bul.
Aşama 3: Optimization & Verification
- De-optimization: V8 (JS) optimizasyonunu bozan pattern'leri (Örn: delete keyword, hidden class changes) temizle.
- Memory: Garbage Collection (Minor/Major GC) sıklığını kontrol et. Çok sık GC = Memory thrashing.
- Verify: Düzeltme sonrası tekrar profil alıp farkı kanıtla.
Kontrol Noktaları
| Aşama | Doğrulama |
|---|---|
| 1 | Profiling yaparken Debug mod (logging) kapalı mı? |
| 2 | Anonim fonksiyonlar yerine isimlendirilmiş fonksiyonlar kullanılıyor mu? (Stack trace okunabilirliği için). |
| 3 | "Idle" zamanı ile "System" zamanı ayrıştırıldı mı? |
Score
Total Score
60/100
Based on repository quality metrics
✓SKILL.md
SKILL.mdファイルが含まれている
+20
○LICENSE
ライセンスが設定されている
0/10
✓説明文
100文字以上の説明がある
+10
○人気
GitHub Stars 100以上
0/15
○最近の活動
3ヶ月以内に更新がある
0/10
○フォーク
10回以上フォークされている
0/5
✓Issue管理
オープンIssueが50未満
+5
✓言語
プログラミング言語が設定されている
+5
○タグ
1つ以上のタグが設定されている
0/5
Reviews
💬
Reviews coming soon