תארו לעצמכם שהרצתם בדיקת בק-טסט על 10,000 עסקאות: Sharpe 1.8, שיעור זכייה 54%, אבל עקומת ההון שותקת—אין benchmark, אין תרשים drawdown. אתם רואים רק את המספר הסופי. איפה האסטרטגיה הפסידה 20% בשבוע? בלי ויזואליזציה, זה ניחוש. לקוחות של פלטפורמות מסחר אלגוריתמי ולוחות מחוונים למסחר אלגוריתמי מתלוננים לעתים קרובות על טבלאות עם אלפי שורות שבהן אי אפשר למצוא נקודת כשל. עם 5 שנות ניסיון ו-15+ פרויקטי לוחות מחוונים שהושלמו, פתרנו את זה מאז הקמת החברה, תוך יישום של למעלה מ-15 לוחות מחוונים לפרויקטי DeFi ופתרונות בק-טסט לקריפטו. לדוגמה, בפרויקט אחד עם 50,000 עסקאות, סוחרים בילו 4 שעות בחיפוש אחר drawdown—אחרי לוח המחוונים שלנו, זה לקח 15 דקות. עלויות התמיכה ירדו ב-30%, ולקוחות חוסכים 5,000$ בחודש בעלויות אנליסטים הודות לניתוח drawdown אוטומטי. בנוסף, לקוח אחד דיווח על חיסכון של 12,000$ לרבעון בזכות ביטול דיווח ידני.
רכיבי ויזואליזציה של תוצאות בק-טסט
עקומת ההון (התרשים הראשי) בנויה על React TradingView Lightweight Charts או Recharts. קריטי: אנו מצמידים benchmark—החזקת BTC/ETH או מדד. בלי benchmark, עקומת ההון לא אומרת כלום: אסטרטגיה יכלה לגדול ב-40% בזמן שהשוק עלה ב-200%. אנו מבטיחים סנכרון של ציר הזמן עם תרשים ה-drawdown וגרף ה-drawdown כך שכל drawdown מציג את הקשר השוקי. לדוגמה, drawdown של -15% בעקומת ההון עשוי לנבוע מירידת שוק של -20%—ה-benchmark יחשוף זאת.
איך עקומת הון עם benchmark חושפת חולשות?
על ידי הצמדת benchmark, אתם רואים את האלפא של האסטרטגיה. אם עקומת ההון עוקבת אחרי ה-benchmark, האסטרטגיה לא מוסיפה ערך. בלוח המחוונים שלנו, זה מוצג עם אזורים צבעוניים: אזור ירוק לביצועים עודפים, אדום לביצועים חסרים. לחיצה על אזור פותחת את רשימת העסקאות לאותה תקופה. זה מקצר את זמן הניתוח ב-60%.
מה תרשים ה-drawdown מספק?
תרשים נפרד מתחת לעקומת ההון מציג את גרף ה-drawdown מהשיא ההיסטורי באחוזים. הוא מחושב כך:
const computeDrawdown = (equity: number[]): number[] => {
let peak = equity[0];
return equity.map((value) => {
if (value > peak) peak = value;
return ((value - peak) / peak) * 100;
});
};סנכרון הוא חובה: המשתמש רואה גם "כאן drawdown של -35%" וגם "מה קרה למחיר ה-BTC." זה מבדיל בין drawdown שיטתי לבין כזה המונע משוק.
טבלת עסקאות וסטטיסטיקות מצטברות
טבלת העסקאות היא רשימה וירטואלית (react-virtual או TanStack Virtual) עם מיון וסינון. עם 5,000+ עסקאות, רינדור DOM רגיל הורג את הביצועים—אנו מפחיתים את השימוש בזיכרון ב-40% באמצעות וירטואליזציה. עמודות: תאריך כניסה/יציאה, כיוון, גודל, מחיר, רווח והפסד, עמלות.
אנו מחלקים מדדים לקבוצות:
| קבוצה | מדדים |
|---|---|
| תשואה | תשואה כוללת, CAGR, מפת חום של תשואות חודשיות |
| סיכון | Drawdown מקסימלי, משך drawdown ממוצע, VaR 95% |
| איכות | יחס Sharpe, יחס Sortino, יחס Calmar |
| מסחר | שיעור זכייה, פקטור רווח, רווח/הפסד ממוצע, הפסדים רצופים מקסימליים |
מפת החום של התשואות (מפת חום של תשואות חודשיות) היא מטריצה של שנה × חודש, צבועה מאדום לירוק. מיושמת עם const computeDrawdown = (equity: number[]): number[] => { let peak = equity[0]; return equity.map((value) => { if (value > peak) peak = value; return ((value - peak) / peak) * 100; }); }; או SVG מותאם אישית. היא מאפשרת לזהות מיידית עונתיות ותקופות בעייתיות פי 3 מהר יותר מניתוח מבוסס טבלה.
איך מיושם קישור דו-כיווני בין רכיבים?
לחיצה על עקומת ההון חושפת את רשימת העסקאות לתקופה הנבחרת. לחיצה על שורת עסקה מדגישה את סמני הכניסה/יציאה שלה בתרשים המחיר. אנו משתמשים במצב בחירה משותף ב-Zustand, מנויי API של תרשים ל-hover/click, וסינון דינמי של טבלה. זה מקצר את זמן חיפוש השגיאות פי 2. כל רכיב ויזואליזציית העסקאות מסונכרן באמצעות זרימת נתונים חד-כיוונית, המבטיחה ניהול מצב דטרמיניסטי.
ביצועים עם מערכי נתונים גדולים
עם 50k+ נקודות, רינדור טבעי מפגר. עבור לקוח עם 10,000 עסקאות, לוח המחוונים נטען תוך פחות מ-3 שניות. השוואת שיטות:
השוואת ביצועים למערכי נתונים גדולים
| שיטה | שיפור ביצועים | יישום |
|---|---|---|
| Decimation | +60% FPS | זום החוצה: צבירה לפי יום |
| Web Worker | +100% FPS | חישוב מדדים מחוץ ל-thread הראשי |
| עדכונים מצטברים | +50% FPS | נתוני סטרימינג |
אסטרטגיות:
- Decimation: זום החוצה משתמש בנתונים מצטברים (OHLC ליום), זום פנימה בפרטים מלאים.
- Web Worker: חישוב מדדים מועבר מחוץ ל-thread הראשי.
- עדכונים מצטברים: עדכוני נתוני סטרימינג דרך
@nivo/heatmap.
יצירה שלב אחר שלב של לוח מחוונים לבק-טסט
- הגדירו את קבוצת המדדים ומקור הנתונים (CSV, API, מסד נתונים של עסקאות).
- בחרו ספריית תרשימים: React TradingView Lightweight Charts לעקומת הון ומחיר, @nivo/heatmap למפת חום.
- יישמו טבלה וירטואלית עם TanStack Virtual וקשרו לתרשימים דרך store יחיד (Zustand).
- הגדירו Web Worker למדדים וייצוא ל-CSV/PDF.
ייצוא ושיתוף
סט מינימלי: CSV (עסקאות), PDF (תרשימים + מדדים) דרך html2canvas ו-jsPDF, קישור קבוע לויזואליזציית הבק-טסט דרך מצב hash של ה-URL לשיתוף. ייצוא תוצאות ל-CSV ו-PDF באמצעות html2canvas ו-jsPDF. אנו משתמשים ב-יחס Sharpe כיחס תשואה לסיכון; מציגים אותו בלוח המחוונים.
רשימת בדיקה לפני השקת לוח המחוונים
- סנכרון תרשים ה-drawdown עם עקומת ההון אומת.
- benchmark נוסף (לפחות BTC).
- וירטואליזציה מופעלת לטבלה עם >3000 שורות.
- Web Worker מוגדר למדדים.
- ייצוא תוצאות ל-CSV ו-PDF מיושם.
מה כלול בעבודה
- ארכיטקטורת לוח מחוונים (בחירת ספריות, זרימת נתונים).
- יישום כל התרשימים עם סנכרון.
- טבלה וירטואלית עם עמודות מותאמות אישית.
- קישורים אינטראקטיביים (תרשים → טבלה → תרשים).
- הגדרת ייצוא וקישור קבוע.
- אופטימיזציה למערכי נתונים גדולים (Web Worker, decimation).
- בדיקות על תרחישי בק-טסט של אסטרטגיות אמיתיות.
- תיעוד והדרכת צוות.
צרו קשר כדי לדון בפרטי הפרויקט שלכם. קבלו ייעוץ על ארכיטקטורת לוח מחוונים—פנו אלינו דרך Telegram או דוא"ל. הזמינו פיתוח לוח מחוונים וקצרו את זמן ניתוח האסטרטגיה ב-70%.







