162 lines
No EOL
7.3 KiB
Markdown
162 lines
No EOL
7.3 KiB
Markdown
# Article-23867-Building-AI-Powered-Trading-Systems-UI-Optimization
|
|
|
|
This repository is an article-derived reference project based on the original MQL5 article. It does not claim to reproduce the full original source code unless files are explicitly attached.
|
|
|
|
|
|
|
|
## Overview
|
|
|
|
This repository is derived from the MQL5 article about optimizing a canvas-based AI trading dashboard interface in MetaTrader 5. The article focuses on improving UI responsiveness without changing visual appearance by introducing frame throttling, partial rendering, direct pixel-buffer operations, and text/glyph caching.
|
|
|
|
The material belongs to a broader AI-powered trading systems series and documents architectural improvements to an Expert Advisor user interface rather than a standalone trading strategy. As a repository, it serves as a reference for reconstructing or studying the rendering pipeline and interaction optimization techniques described in the article.
|
|
|
|
## Original Article
|
|
|
|
- **Article ID:** 23867
|
|
- **Title:** Building AI-Powered Trading Systems in MQL5 (Part 11): Optimizing the UI with Frame Throttling and Partial Rendering
|
|
- **Author:** Allan Munene Mutiiria
|
|
- **Publication date:** Not available
|
|
- **Categories:** Trading Systems, Integration, Expert Advisors, Statistics
|
|
- **Article URL:** https://www.mql5.com/en/articles/23867
|
|
- **Author profile:** https://www.mql5.com/en/users/29210372
|
|
|
|
## Repository Purpose
|
|
|
|
This repository exists to preserve and organize the technical ideas from the article in a repository-friendly form.
|
|
|
|
A reader can use it to:
|
|
|
|
- study how an MQL5 canvas UI can be optimized for high-frequency interaction,
|
|
- understand how repaint throttling can reduce redundant redraws,
|
|
- learn how partial rendering can limit work to only the affected pane or overlay,
|
|
- reuse the article’s architectural patterns for responsive dashboard-style Expert Advisors,
|
|
- examine the module structure referenced by the author when rebuilding or adapting a similar interface.
|
|
|
|
## Key Concepts
|
|
|
|
- Trading Systems
|
|
- Integration
|
|
- Expert Advisors
|
|
- Statistics
|
|
- Canvas-based UI rendering
|
|
- Frame throttling
|
|
- Partial rendering
|
|
- Region-based repainting
|
|
- Direct pixel-buffer canvas access
|
|
- Text-width caching
|
|
- Glyph coverage caching
|
|
- Event-driven UI updates
|
|
- Overlay and popup restoration
|
|
|
|
## Algorithm / Architecture Summary
|
|
|
|
The article describes a UI optimization workflow for a canvas-based AI dashboard in MQL5.
|
|
|
|
1. **Identify the performance bottleneck**
|
|
- The original interface repainted the entire dashboard on every hover, scroll, drag, or popup event.
|
|
- Text was also re-measured repeatedly through operating system calls, increasing redraw cost.
|
|
|
|
2. **Introduce a faster canvas abstraction**
|
|
- A `CAiCanvasFast` class extends `CCanvas`.
|
|
- It adds direct access to the pixel buffer for fast pixel reads, writes, fills, and rectangle copies.
|
|
- When both source and destination use the fast canvas type, row blocks can be copied efficiently with contiguous memory operations.
|
|
|
|
3. **Reduce repeated font and text work**
|
|
- Font state is cached so repeated `TextSetFont` calls are skipped when the font name and size are unchanged.
|
|
- A shared string hash function is used to build lookup keys for caches.
|
|
|
|
4. **Cache text widths**
|
|
- A memo table stores measured widths keyed by text, font, and size.
|
|
- Repeated labels can be measured once and reused rather than recalculated on every frame.
|
|
|
|
5. **Cache rendered glyph coverage**
|
|
- A larger cache stores rasterized glyph-run coverage maps.
|
|
- On cache hit, previously derived coverage is reused.
|
|
- On miss, text is rasterized once and stored, subject to a memory budget reset mechanism.
|
|
|
|
6. **Throttle repaint frequency**
|
|
- A frame interval of about 16 ms is used to cap repainting near 60 FPS.
|
|
- If many events occur inside the cap window, they are collapsed into a deferred frame.
|
|
- A timer later flushes the deferred repaint so correctness is preserved.
|
|
|
|
7. **Separate full, partial, and overlay repaint paths**
|
|
- Full repaint handles cases where the entire dashboard must be redrawn.
|
|
- Partial repaint updates only the affected pane, such as chat, search, or prompt areas.
|
|
- Overlay repaint restores the area under floating popups from a saved backdrop and redraws only the popup.
|
|
|
|
8. **Snapshot the backdrop**
|
|
- A popup-free copy of the main panel is saved.
|
|
- When dropdowns or history popups move or close, the background can be restored by copying the saved region back instead of rebuilding the entire UI.
|
|
|
|
9. **Map hover events to UI regions**
|
|
- Hover targets are grouped into regions such as header, sidebar, footer, and chat.
|
|
- When hover state changes, only the affected regions are repainted unless the target is unknown, in which case a full repaint is used for safety.
|
|
|
|
10. **Wire scoped repaint requests into interaction handlers**
|
|
- The interaction layer chooses the smallest correct repaint path:
|
|
- full frame for major popup state changes,
|
|
- overlay-only frame for floating popup updates,
|
|
- region-scoped hover frame for normal hover movement,
|
|
- pane-scoped partial frame for scroll activity.
|
|
|
|
Overall, the architecture aims to minimize both **how often** the UI repaints and **how much** it repaints each time.
|
|
|
|
## Mentioned or Attached Files
|
|
|
|
### Explicitly attached files
|
|
|
|
The processed input indicates that an attached ZIP archive is available, and the article also explicitly lists the following attached files:
|
|
|
|
- `AI Canvas Theme.mqh`
|
|
- `AI Canvas Primitives.mqh`
|
|
- `AI JSON FILE.mqh`
|
|
- `AI Canvas State.mqh`
|
|
- `AI Canvas Scrollbar.mqh`
|
|
- `AI Canvas Editor.mqh`
|
|
- `AI Canvas Render.mqh`
|
|
- `AI Logic.mqh`
|
|
- `AI Canvas Interact.mqh`
|
|
- `AI Canvas Shell.mqh`
|
|
- `AI EA PART 11.mq5`
|
|
- `MQL5.zip`
|
|
|
|
### Files mentioned in the article text
|
|
|
|
- primitives file
|
|
|
|
## Statistics
|
|
|
|
- **Word count:** Not available
|
|
- **Reading time:** Not available
|
|
- **Image count:** Not available
|
|
- **Code block count:** Not available
|
|
- **File count:** Not available
|
|
|
|
## Tags
|
|
|
|
- mql5
|
|
- metatrader-5
|
|
- trading-systems
|
|
- integration
|
|
- expert-advisors
|
|
- statistics
|
|
- difficulty-advanced
|
|
|
|
## Difficulty
|
|
|
|
**Advanced**
|
|
|
|
Reason: the article covers nontrivial UI architecture in MQL5, including custom canvas extensions, cache design, timer-driven frame scheduling, partial redraw logic, overlay restoration, and event-region mapping rather than basic EA scripting.
|
|
|
|
## Limitations
|
|
|
|
- This is an article-derived reference repository, not a guaranteed byte-for-byte reproduction of the author’s original project.
|
|
- Full usability depends on the files actually attached or otherwise provided by the original article author.
|
|
- Although the article includes detailed code excerpts and an attachment list, this README does not assume that every file has been extracted and verified inside this repository unless explicitly present.
|
|
- The article focuses on UI optimization architecture for an AI-assisted trading interface, not on validating a production-ready trading system.
|
|
- Any reconstruction based only on article text may omit surrounding project context from earlier parts of the series.
|
|
|
|
## Reference
|
|
|
|
- Original article: https://www.mql5.com/en/articles/23867
|
|
- Author profile: https://www.mql5.com/en/users/29210372 |