mnemo_cards/games/CHAIN_SIMPLIFICATION.md

🔗 Упрощение цепочки вызовов в Web App

📊 Сравнение: До и После

❌ Старая цепочка (6 уровней):

Flutter Host → JavaScript → webAppBridge → _handleMessage → _dartHandler → dartHandler → Dart → BridgeManager → Payload Handler

Детализация:

1. window.flutterBridge.receiveMessage(message)
2. window.webAppBridge.receiveMessage(message)
3. window.webAppBridge._handleMessage(message)
4. window.webAppBridge._dartHandler(message)
5. window.dartHandler(message)
6. _bridgeManager!.handleIncomingMessage(bridgeMessage)
7. handler.handle(payload) ← Финальный

✅ Новая цепочка (3 уровня):

Flutter Host → JavaScript → Dart → BridgeManager → Payload Handler

Детализация:

1. window.flutterBridge.receiveMessage(message)
2. window.dartHandler(message) ← Прямой вызов
3. _bridgeManager!.handleIncomingMessage(bridgeMessage)
4. handler.handle(payload) ← Финальный

🎯 Упрощения:

1. Убраны промежуточные JavaScript функции:

• ❌ window.webAppBridge.receiveMessage
• ❌ window.webAppBridge._handleMessage
• ❌ window.webAppBridge._dartHandler
• ❌ window.webAppBridge.setMessageHandler

2. Прямая связь:

• ✅ window.flutterBridge.receiveMessage → window.dartHandler
• ✅ Минимум промежуточных вызовов
• ✅ Быстрая передача сообщений

3. Упрощенный JavaScript код:

// БЫЛО (сложно):
window.flutterBridge.receiveMessage = function(message) {
  if (window.webAppBridge && window.webAppBridge.receiveMessage) {
    window.webAppBridge.receiveMessage(message);
  }
};

// СТАЛО (просто):
window.flutterBridge.receiveMessage = function(message) {
  if (window.dartHandler) {
    window.dartHandler(message);
  }
};

🐛 Найденная и исправленная проблема:

❌ Проблема:

При отправке сообщения из Host в Web App получалась ошибка:

[Flutter Bridge] Web app bridge не доступен

🔍 Причина:

В проекте остались старые JavaScript файлы, которые конфликтовали с новым упрощенным кодом:

• apps/web_app1/web/index.html - содержал старый JavaScript код
• packages/bridge_core/web/bridge.js - устаревший файл с дублированным кодом

✅ Решение:

1. Удален старый JavaScript код из index.html
2. Удален файл packages/bridge_core/web/bridge.js
3. Оставлен только централизованный код в bridge_script.dart

📝 Результат:

• ✅ Убраны конфликты между старым и новым кодом
• ✅ Все JavaScript код теперь централизован в bridge_script.dart
• ✅ Упрощенная цепочка вызовов работает корректно

🐛 Вторая найденная и исправленная проблема:

❌ Проблема:

После исправления первой проблемы появилась новая ошибка:

[Web App Bridge] !!!Dart обработчик не определен!!!

🔍 Причина:

Неправильный порядок инициализации в WebBridge:

1. _setupDartHandler() устанавливал js.context['dartHandler']
2. _bridgeManager!.initialize() вызывал WebTransport.initialize()
3. WebTransport.initialize() выполнял globalDartHandlerScript
4. globalDartHandlerScript перезаписывал dartHandler на заглушку

✅ Решение:

Изменил порядок инициализации в WebBridge:

// БЫЛО:
_setupDartHandler();           // 1. Устанавливаем Dart обработчик
_bridgeManager!.initialize();  // 2. JavaScript перезаписывает его

// СТАЛО:
_bridgeManager!.initialize();  // 1. Сначала инициализируем BridgeManager
_setupDartHandler();           // 2. Потом устанавливаем Dart обработчик

📝 Результат:

• ✅ Dart обработчик больше не перезаписывается JavaScript
• ✅ Сообщения корректно передаются из JavaScript в Dart
• ✅ Упрощенная цепочка вызовов работает полностью

📈 Преимущества:

✅ Производительность

• 50% меньше вызовов (6 → 3)
• Быстрее передача сообщений
• Меньше накладных расходов

✅ Простота

• Легче отлаживать - меньше уровней
• Проще понимать - прямая связь
• Меньше кода - убраны промежуточные функции

✅ Надежность

• Меньше точек отказа - меньше промежуточных звеньев
• Проще тестировать - меньше зависимостей
• Легче поддерживать - меньше сложности

🔧 Технические изменения:

1. bridge_script.dart

// Убраны скрипты:
// - messageHandlerScript
// - dartHandlerScript  
// - dartMessageHandlerScript

// Оставлен только:
// - globalDartHandlerScript

2. bridge_transport.dart

// Убраны вызовы:
// - BridgeScript.messageHandlerScript
// - BridgeScript.dartHandlerScript
// - BridgeScript.dartMessageHandlerScript

// Оставлен только:
// - BridgeScript.globalDartHandlerScript

3. web_bridge.dart

// Не изменился - уже был оптимальным
// js.context['dartHandler'] = (String message) { ... }

4. index.html

<!-- Удален старый JavaScript код -->
<!-- Оставлен только простой лог -->
<script>
  console.log('[Web App] HTML загружен, ожидание инициализации bridge...');
</script>

5. bridge.js

# Удален файл packages/bridge_core/web/bridge.js
# Весь JavaScript код теперь в bridge_script.dart

🎉 Результат:

✅ Достигнутые цели:

• ✅ Упрощена цепочка вызовов (6 → 3 уровней)
• ✅ Убраны избыточные JavaScript функции
• ✅ Устранены конфликты между старым и новым кодом
• ✅ Сохранена функциональность
• ✅ Улучшена производительность
• ✅ Упрощена отладка

🚀 Готовность к использованию:

Система стала более:

• Быстрой - меньше промежуточных вызовов
• Простой - прямая связь JavaScript ↔ Dart
• Надежной - меньше точек отказа
• Поддерживаемой - меньше сложности
• Чистой - нет дублированного кода

---

Упрощение завершено успешно! 🎉