Starter/samples
1
0
Fork 0
mirror of https://github.com/flutter/samples.git synced 2025-11-08 13:58:47 +00:00
Code Issues Releases Wiki Activity

Add web startup analyzer to material 3 demo (#2144)

Browse Source 
This adds a tool to measure web app startup for the Material 3 demo.

Demo:
- [Example app](https://flutter-web-perf-experiments.web.app/)
- [Material
3](https://flutter-web-perf-experiments--material3-vswzldcy.web.app/)
(open console)

---------

Co-authored-by: Brett Morgan <brett.morgan@gmail.com>
Co-authored-by: Kevin Moore <kevmoo@google.com>
This commit is contained in:
John Ryan
2024-01-29 13:24:56 -08:00
committed by GitHub
parent dc37f37b5c
commit d96bb336b6
26 changed files with 670 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
experimental/material_3_demo/lib/main.dart
View File

@@ -2,12 +2,31 @@
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.
import 'dart:convert';
import 'package:flutter/material.dart';
import 'package:web_startup_analyzer/web_startup_analyzer.dart';
import 'constants.dart';
import 'home.dart';
void main() {
void main() async {
var analyzer = WebStartupAnalyzer(additionalFrameCount: 10);
debugPrint(json.encode(analyzer.startupTiming));
analyzer.onFirstFrame.addListener(() {
debugPrint(json.encode({'firstFrame': analyzer.onFirstFrame.value}));
});
analyzer.onFirstPaint.addListener(() {
debugPrint(json.encode({
'firstPaint': analyzer.onFirstPaint.value?.$1,
'firstContentfulPaint': analyzer.onFirstPaint.value?.$2,
}));
});
analyzer.onAdditionalFrames.addListener(() {
debugPrint(json.encode({
'additionalFrames': analyzer.onAdditionalFrames.value,
}));
});
runApp(
const App(),
);

3
experimental/material_3_demo/pubspec.yaml
View File

@@ -9,6 +9,7 @@ version: 1.0.0+1
environment:
sdk: ^3.2.0
flutter: ^3.16.0
dependencies:
flutter:
@@ -16,6 +17,8 @@ dependencies:
cupertino_icons: ^1.0.2
url_launcher: ^6.1.8
web_startup_analyzer:
path: ../../web/_packages/web_startup_analyzer
dev_dependencies:
analysis_defaults:

36
experimental/material_3_demo/web/index.html
View File

@@ -38,22 +38,30 @@
</script>
<!-- This script adds the flutter initialization JS code -->
<script src="flutter.js" defer></script>
<script type="text/javascript" src="assets/packages/web_startup_analyzer/lib/web_startup_analyzer.js"></script>
</head>
<body>
<script>
window.addEventListener('load', function(ev) {
// Download main.dart.js
_flutter.loader.loadEntrypoint({
serviceWorker: {
serviceWorkerVersion: serviceWorkerVersion,
},
onEntrypointLoaded: function(engineInitializer) {
engineInitializer.initializeEngine().then(function(appRunner) {
appRunner.runApp();
});
}
});
<script>
var flutterWebStartupAnalyzer = new FlutterWebStartupAnalyzer();
var analyzer = flutterWebStartupAnalyzer;
window.addEventListener('load', function(ev) {
analyzer.markStart("loadEntrypoint");
_flutter.loader.loadEntrypoint({
serviceWorker: {
serviceWorkerVersion: serviceWorkerVersion,
},
onEntrypointLoaded: function(engineInitializer) {
analyzer.markFinished("loadEntrypoint");
analyzer.markStart("initializeEngine");
engineInitializer.initializeEngine().then(function(appRunner) {
analyzer.markFinished("initializeEngine");
analyzer.markStart("appRunnerRunApp");
appRunner.runApp();
});
}
});
</script>
});
</script>
</body>
</html>