CakeWallet/lib/src/screens/dev/moneroc_call_profiler.dart
tuxsudo df88914628
New themes (#2239)
* Add theme base v2

* Initial new theme base files

* Typos

* Fixes

* Update theme files

* feat: Migrate to Material 3 Theming

Foundation, Theme Data Refactor, and First Extension Cleanup Batch.

This commit completes the first major phase of migrating to Material 3 theming by setting up the foundations for material 3 integration and begins the initial migration, removing custom theme extensions, updating theme data, and refactoring all relevant widget and page theming to use Material 3’s built-in color and typography tokens.

These changes:
- Lays the groundwork for Material 3 theming by restructuring the app’s theme configuration to use Material 3’s ColorScheme and TextTheme as the primary sources of color and typography throughout the app.
- Refactors the core theme config files by removing legacy custom color roles ensuring all color definitions now map directly to Material 3’s role.
- Begins the first batch migration of custom theme extensions (InfoTheme, PlaceholderTheme, KeyboardTheme, PinCodeTheme) and updates all affected widgets and pages to use Material 3 color and typography tokens instead of the custom properties.
- Cleans up the codebase by deleting the files of the initial set of migrated extensions and eliminating all related imports and usages.

* feat: Migrate to Material 3 Theming.

This change:
- Updates the themes README.md file to reflect the current structure and give more information based on the first major phase that was completed.

* feat: Migrate to Material 3 Theming

Deleting previous theme extensions

* feat: Migrate to Material 3 Theming

Another batch of migrations from existing extensions

* feat: Migration to Material 3 Theming

Third Migration batch for theme extensions

* fwat: Migration to Material 3 Theming

Final Migration batch for previous theme extensions

* Update onboarding hero

* Update button radius

* Add surfaceContainer to light theme

* feat(themes): Migrate to Material 3 Theming

This change:
- Adds new set of hero images
- Modifies the core structure for the themes
- Add missing color tokens to the theme classes
- Adds a CustomThemeColor class for custom color tokens
- Modifies the themelist to have a fall back for previous theme implementation
- Adds localization for some texts
- Modifies the flow for loading the theme on app start
- Add a WidgetsBindingObserver that listens for changes in the device theme and updates the app theme when there is a change
- Registers the themeStore as a Singleton for codebase wide use

* feat(themes): Migrate to Material 3 theming

This change:
- Migrates UI flows across the app to the new themes
- Confirms styling and typography of components across the app uses the new themes
- Remove instances of Palette use
- Switch TextStyles across the app to use theme text styles

* feat(themes): Migrate to Material 3 Theming.

This change:
- Adjusts bottomsheets styling and removes duplicate close button
- Removes more themedata extensions from the previous implementation

* - Remove outlines from cards and dock
- Update menu colors
- Update padding/divider size for cards

* - Update PIN screen
- Fix navigation dock shadow
- Update wallet screen colors

* Update border radius --skip-ci

* feat(themes): Migrate to Material 3 Theming.

This change:
- Adds gradient backgrounds to the dashbaord and balance cards.
- Migrates the input fields across the app to BaseTextFormFields.
- Removes dependence of input fields on individual styling, focusing instead on using theme defined InputDecoration styling with adjustments on individual components where needed.
- Applies new theme styling to BaseTextFormField, AddressTextField and CurrencyAmountTextField.

* - Switch some hero images to PNG
- Fix nagivation_dock shadow
- Minor fixes

* feat: Add fallback to previous underline styling in central widgets

This change:
- Adds a fallback to CurrencyAmountTextField, AddressTextField, and BaseTextFormField, allowing them use the previous theme styling.
- Adds localization for new texts

* feat(themes): Update warning box colors for dark and light themes

* feat(themes): Relaod themes when user restores from backup, ensuring the user previous theme preference is used.

* feat(themes): Handle themes logic during restore from backup

This change:
- Refactors theme loading logic to handle backup restore edgecase
- Refreshes the theme based on the user saved preference during restore from backup flow

* Fix card gradients and spacing

* Fix even more radiuses
Test new icons for navigation_dock.dart

* Update onboarding flow backgrounds
Fix swap icon clipping
Fix some text colors
Add more hero images

* Fix incorrect color for light theme

* Fix more hero images and cleanup

* Update text field icons
Fix info box CTA colors
Fix sync indicator colors

* Update toggle colors
Update dark theme colors (minor)
Update crypto_balance_widget.dart icon

* Update page transitions in router.dart
Fix some colors

* feat(themes): Display label by default for filled textfields

* feat(themes): Refactor theme handling across various components

This change:
- Fixes issue with themeMode resetting to system mode when app is restarted causing a UI glitch
- Updates theme checks from `currentTheme.type == ThemeType.dark` to `currentTheme.isDark` for consistency
- Adjusts UI components to use the theme directly from the themeStore

* feat(themes): Add animating tagline to the create pin welcome screen

* Revert text fields label temporarily, fix a couple colors, and cleanup some images

---------

Co-authored-by: OmarHatem <omarh.ismail1@gmail.com>
Co-authored-by: Blazebrain <davidadegoke16@gmail.com>
2025-05-25 23:11:45 +03:00

253 lines
7.5 KiB
Dart

// code shamelessly stolen from xmruw
// https://raw.githubusercontent.com/MrCyjaneK/unnamed_monero_wallet/refs/heads/master-rewrite/lib/pages/debug/performance.dart
import 'dart:math';
import 'package:cake_wallet/di.dart';
import 'package:cake_wallet/monero/monero.dart';
import 'package:cake_wallet/src/widgets/primary_button.dart';
import 'package:cake_wallet/view_model/dashboard/dashboard_view_model.dart';
import 'package:cake_wallet/wownero/wownero.dart';
import 'package:cake_wallet/zano/zano.dart';
import 'package:cw_core/wallet_type.dart';
import 'package:flutter/material.dart';
import 'package:cake_wallet/src/screens/base_page.dart';
class DevMoneroCallProfilerPage extends BasePage {
DevMoneroCallProfilerPage();
@override
String? get title => "[dev] xmr call profiler";
@override
Widget body(BuildContext context) {
return PerformanceDebug();
}
}
class PerformanceDebug extends StatefulWidget {
const PerformanceDebug({super.key});
@override
State<PerformanceDebug> createState() => _PerformanceDebugState();
}
enum ProfilableWallet {
monero,
wownero,
zano,
}
class _PerformanceDebugState extends State<PerformanceDebug> {
List<Widget> widgets = [];
final dashboardViewModel = getIt.get<DashboardViewModel>();
late ProfilableWallet wallet = switch (dashboardViewModel.wallet.type) {
WalletType.monero => ProfilableWallet.monero,
WalletType.wownero => ProfilableWallet.wownero,
WalletType.zano => ProfilableWallet.zano,
_ => throw Exception("Unknown wallet type"),
};
final precalc = 1700298;
late Map<String, List<int>> debugCallLength = switch (wallet) {
ProfilableWallet.monero => monero!.debugCallLength(),
ProfilableWallet.wownero => wownero!.debugCallLength(),
ProfilableWallet.zano => zano!.debugCallLength(),
};
int getOpenWalletTime() {
if (debugCallLength["MONERO_Wallet_init"] == null) {
return precalc;
}
if (debugCallLength["MONERO_Wallet_init"]!.isEmpty) {
return precalc;
}
return debugCallLength["MONERO_Wallet_init"]!.last;
}
late final String perfInfo = """
---- Performance tuning
This page lists all calls that take place during the app runtime.-
As per Flutter docs we can read:
> Flutter aims to provide 60 frames per second (fps) performance, or 120 fps-
performance on devices capable of 120Hz updates.
With that in mind we will aim to render frames every 8.3ms (~8333 µs). It is-
however acceptable to reach 16.6 ms (~16666 µs) but we should also keep in mind-
that there are also UI costs that aren't part of this benchmark.
For some calls it is also acceptable to exceed this amount of time, for example-
MONERO_Wallet_init takes ~${getOpenWalletTime()}µs-
(${(getOpenWalletTime() / frameTime).toStringAsFixed(2)} frames). That time would-
be unnaceptable in most situations but since we call this function only when-
opening the wallet it is completely fine to freeze the UI for the time being --
as the user won't even notice that something happened.
---- Details
count: how many times did we call this function [total time (% of frame)]
average: average execution time (% of frame)
min: fastest execution (% of frame)
max: slowest execution (% of frame)
95th: 95% of the time, the function is faster than this amount of time (% of frame)
"""
.split("-\n")
.join(" ");
late final frameTime = 8333;
late final frameGreenTier = frameTime ~/ 100;
late final frameBlueTier = frameTime ~/ 10;
late final frameBlueGreyTier = frameTime ~/ 2;
late final frameYellowTier = frameTime;
late final frameOrangeTier = frameTime * 2;
Color? perfc(num frame) {
if (frame < frameGreenTier) return Colors.green;
if (frame < frameBlueTier) return Colors.blue;
if (frame < frameBlueGreyTier) return Colors.blueGrey;
if (frame < frameGreenTier) return Colors.green;
if (frame < frameYellowTier) return Colors.yellow;
if (frame < frameOrangeTier) return Colors.orange;
return Colors.red;
}
@override
void initState() {
_buildWidgets();
super.initState();
}
SelectableText cw(String text, Color? color) {
return SelectableText(
text,
style: Theme.of(context).textTheme.bodyMedium!.copyWith(color: color),
);
}
void _buildWidgets() {
List<Widget> ws = [];
ws.add(Column(
mainAxisSize: MainAxisSize.min,
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
SelectableText(perfInfo),
cw("< 1% of a frame (max: $frameGreenTierµs)", Colors.green),
cw("< 10% of a frame (max: $frameBlueTierµs)", Colors.blue),
cw("< 50% of a frame (max: $frameBlueGreyTierµs)", Colors.blueGrey),
cw("< 100% of a frame (max: $frameYellowTierµs)", Colors.yellow),
cw("< 200% of a frame (max: $frameOrangeTierµs)", Colors.orange),
cw("> 200% of a frame (UI junk visible)", Colors.red),
],
));
final keys = debugCallLength.keys.toList();
keys.sort((s1, s2) =>
_n95th(debugCallLength[s2]!) -
_n95th(debugCallLength[s1]!));
for (var key in keys) {
final value = debugCallLength[key];
if (value == null) continue;
final avg = _avg(value);
final min = _min(value);
final max = _max(value);
final np = _n95th(value);
final total = _total(value);
ws.add(
Card(
child: ListTile(
title: Text(
key,
style: Theme.of(context).textTheme.bodyMedium!.copyWith(color: perfc(np)),
),
subtitle: Column(
mainAxisSize: MainAxisSize.min,
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(children: [
cw("count: ${value.length}", null),
const Spacer(),
cw("${_str(total / 1000)}ms", perfc(total)),
]),
cw("average: ${_str(avg)}µs (~${_str(avg / (frameTime))}f)",
perfc(avg)),
cw("min: $minµs (~${_str(min / (frameTime) * 100)})",
perfc(min)),
cw("max: $maxµs (~${_str(max / (frameTime) * 100)}%)",
perfc(max)),
cw("95th: $npµs (~${_str(np / (frameTime) * 100)}%)",
perfc(np)),
],
),
),
),
);
}
if (debugCallLength.isNotEmpty) {
ws.add(
PrimaryButton(
text: "Purge statistics",
onPressed: _purgeStats,
color: Colors.red,
textColor: Colors.white,
),
);
}
setState(() {
widgets = ws;
});
}
void _purgeStats() {
debugCallLength.clear();
_buildWidgets();
}
int _min(List<int> l) {
return l.reduce(min);
}
int _max(List<int> l) {
return l.reduce(max);
}
int _n95th(List<int> l) {
final l0 = l.toList();
l0.sort();
int i = (0.95 * l.length).ceil() - 1;
return l0[i];
}
double _avg(List<int> l) {
int c = 0;
for (var i = 0; i < l.length; i++) {
c += l[i];
}
return c / l.length;
}
int _total(List<int> l) {
int c = 0;
for (var i = 0; i < l.length; i++) {
c += l[i];
}
return c;
}
String _str(num d) => d.toStringAsFixed(2);
@override
Widget build(BuildContext context) {
return SingleChildScrollView(
child: Padding(
padding: const EdgeInsets.all(8),
child: Column(
children: widgets,
),
),
);
}
}