Skip to content

Commit 42f09ec

Browse files
mkustermannmkustermann
committed
Add TodoMVC written in Dart using Jaspr DOM framework
This adds a TodoMVC app written in Dart using the Jaspr DOM framework. The app is compiled in two variants: dart2js and dart2wasm. We compile with * dart2js in unsound (-O4) mode * dart2wasm in sound (-O2) mode as those are the default settings in e.g. flutter tooling. To remember this difference we specify the optimization mode in the benchmark name. The app can be compiled by installing the Dart SDK and running ``` experimental/todomvc-dart-jaspr % ./build.sh |& tee build.log ... ```
1 parent deba93c commit 42f09ec

File tree

27 files changed

+7858
-0
lines changed

27 files changed

+7858
-0
lines changed

‎experimental/todomvc-dart-jaspr/.gitignore

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
.dart_tool/
2+
build/

‎experimental/todomvc-dart-jaspr/README.md

Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
# TodoMVC: Dart Jaspr
2+
3+
## Description
4+
This is a TodoMVC app written in Dart using the Jaspr DOM framework. It can be
5+
compiled to either JavaScript or WebAssembly (with GC extension).
6+
7+
## Setup
8+
9+
Install [dart](https://dart.dev/get-dart) and fetch dependencies using `dart pub get`.
10+
11+
## Running the project
12+
13+
Run your project using `dart run jaspr_cli:jaspr serve`.
14+
15+
The development server will be available on `http://localhost:8080`.
16+
17+
## Building the project
18+
19+
Build your project using either:
20+
21+
- Generate JavaScript via: `dart run jaspr_cli:jaspr build -O4 --extra-js-compiler-option=--no-minify`
22+
- Generate WebAssembly via: `dart run jaspr_cli:jaspr build -O2 --experimental-wasm --extra-wasm-compiler-option=--no-strip-wasm`
23+
24+
The output will be located inside the `build/jaspr/` directory.
25+
26+
## Updating the checked-in build artifacts
27+
To update the checked-in artifacts in the `dist/` directory, run
28+
29+
```
30+
./build.sh 2>&1 | tee build.log
31+
```

‎experimental/todomvc-dart-jaspr/analysis_options.yaml

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
include: package:lints/recommended.yaml
2+
3+
analyzer:
4+
# Jaspr has a custom lint package 'jaspr_lints', which needs the 'custom_lint' analyzer plugin.
5+
#
6+
# Unfortunately, running 'dart analyze' does not pick up the custom lints. Instead, you need to
7+
# run a separate command for this: `jaspr analyze`
8+
plugins:
9+
- custom_lint

‎experimental/todomvc-dart-jaspr/build.log

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
+ set -e
2+
+ echo 'Current Dart SDK version'
3+
Current Dart SDK version
4+
+ dart --version
5+
Dart SDK version: 3.9.0-333.0.dev (dev) (Fri Jul 11 09:03:09 2025 -0700) on "macos_arm64"
6+
+ echo 'Fetching dependencies'
7+
Fetching dependencies
8+
+ dart pub get
9+
Resolving dependencies...
10+
Downloading packages...
11+
_fe_analyzer_shared 82.0.0 (85.0.0 available)
12+
analyzer 7.4.5 (7.5.7 available)
13+
analyzer_plugin 0.13.1 (0.13.4 available)
14+
dds 4.2.7 (5.0.4 available)
15+
devtools_shared 10.0.2 (12.0.0 available)
16+
dtd 2.5.1 (4.0.0 available)
17+
dwds 24.3.5 (24.4.0 available)
18+
json_rpc_2 3.0.3 (4.0.0 available)
19+
mime 1.0.6 (2.0.0 available)
20+
shelf_web_socket 2.0.1 (3.0.0 available)
21+
vm_service 14.3.1 (15.0.2 available)
22+
webdev 3.7.1 (3.7.2 available)
23+
Got dependencies!
24+
12 packages have newer versions incompatible with dependency constraints.
25+
Try `dart pub outdated` for more information.
26+
+ echo 'Building dart2js version in -O4'
27+
Building dart2js version in -O4
28+
+ rm -rf build dist/out-dart2js-O4
29+
+ dart run jaspr_cli:jaspr build -O4 --extra-js-compiler-option=--disable-program-split
30+
Building jaspr for client rendering mode.
31+
⠋ Building web assets......⠙ Building web assets...... (1ms)✓ Completed building web assets. (11.8s)
32+
Completed building project to /build/jaspr.
33+
+ mkdir -p dist/out-dart2js-O4
34+
+ cp build/jaspr/index.html build/jaspr/base.css build/jaspr/index.css build/jaspr/favicon.ico build/jaspr/main.dart.js dist/out-dart2js-O4
35+
+ echo 'Building dart2js version in -O4'
36+
Building dart2js version in -O4
37+
+ rm -rf build dist/out-dart2wasm-O2
38+
+ dart run jaspr_cli:jaspr build -O2 --experimental-wasm
39+
Building jaspr for client rendering mode.
40+
⠋ Building web assets......⠙ Building web assets...... (1ms)✓ Completed building web assets. (12.4s)
41+
Completed building project to /build/jaspr.
42+
+ mkdir -p dist/out-dart2wasm-O2
43+
+ cp build/jaspr/index.html build/jaspr/base.css build/jaspr/index.css build/jaspr/favicon.ico build/jaspr/main.dart.js build/jaspr/main.mjs build/jaspr/main.wasm dist/out-dart2wasm-O2

‎experimental/todomvc-dart-jaspr/build.sh

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
#!/bin/bash
2+
3+
JS_OUT=dist/out-dart2js-O4
4+
WASM_OUT=dist/out-dart2wasm-O2
5+
6+
set -x
7+
set -e
8+
9+
echo "Current Dart SDK version"
10+
dart --version
11+
12+
echo "Fetching dependencies"
13+
dart pub get
14+
15+
# NOTE: For profiling add the following argument to get symbols
16+
# --extra-js-compiler-option=--no-minify
17+
echo "Building dart2js version in -O4"
18+
rm -rf build $JS_OUT
19+
dart run jaspr_cli:jaspr build -O4 --extra-js-compiler-option=--disable-program-split
20+
mkdir -p $JS_OUT
21+
cp build/jaspr/{index.html,base.css,index.css,favicon.ico,main.dart.js} $JS_OUT
22+
23+
# NOTE: For profiling add the following argument to get symbols
24+
# --extra-wasm-compiler-option=--no-strip-wasm
25+
echo "Building dart2js version in -O4"
26+
rm -rf build $WASM_OUT
27+
dart run jaspr_cli:jaspr build -O2 --experimental-wasm
28+
mkdir -p $WASM_OUT
29+
cp build/jaspr/{index.html,base.css,index.css,favicon.ico,main.dart.js,main.mjs,main.wasm} $WASM_OUT

‎experimental/todomvc-dart-jaspr/dist/out-dart2js-O4/base.css

Lines changed: 141 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,141 @@
1+
hr {
2+
margin: 20px 0;
3+
border: 0;
4+
border-top: 1px dashed #c5c5c5;
5+
border-bottom: 1px dashed #f7f7f7;
6+
}
7+
8+
.learn a {
9+
font-weight: normal;
10+
text-decoration: none;
11+
color: #b83f45;
12+
}
13+
14+
.learn a:hover {
15+
text-decoration: underline;
16+
color: #787e7e;
17+
}
18+
19+
.learn h3,
20+
.learn h4,
21+
.learn h5 {
22+
margin: 10px 0;
23+
font-weight: 500;
24+
line-height: 1.2;
25+
color: #000;
26+
}
27+
28+
.learn h3 {
29+
font-size: 24px;
30+
}
31+
32+
.learn h4 {
33+
font-size: 18px;
34+
}
35+
36+
.learn h5 {
37+
margin-bottom: 0;
38+
font-size: 14px;
39+
}
40+
41+
.learn ul {
42+
padding: 0;
43+
margin: 0 0 30px 25px;
44+
}
45+
46+
.learn li {
47+
line-height: 20px;
48+
}
49+
50+
.learn p {
51+
font-size: 15px;
52+
font-weight: 300;
53+
line-height: 1.3;
54+
margin-top: 0;
55+
margin-bottom: 0;
56+
}
57+
58+
#issue-count {
59+
display: none;
60+
}
61+
62+
.quote {
63+
border: none;
64+
margin: 20px 0 60px 0;
65+
}
66+
67+
.quote p {
68+
font-style: italic;
69+
}
70+
71+
.quote p:before {
72+
content: "“";
73+
font-size: 50px;
74+
opacity: 0.15;
75+
position: absolute;
76+
top: -20px;
77+
left: 3px;
78+
}
79+
80+
.quote p:after {
81+
content: "”";
82+
font-size: 50px;
83+
opacity: 0.15;
84+
position: absolute;
85+
bottom: -42px;
86+
right: 3px;
87+
}
88+
89+
.quote footer {
90+
position: absolute;
91+
bottom: -40px;
92+
right: 0;
93+
}
94+
95+
.quote footer img {
96+
border-radius: 3px;
97+
}
98+
99+
.quote footer a {
100+
margin-left: 5px;
101+
vertical-align: middle;
102+
}
103+
104+
.speech-bubble {
105+
position: relative;
106+
padding: 10px;
107+
background: rgba(0, 0, 0, 0.04);
108+
border-radius: 5px;
109+
}
110+
111+
.speech-bubble:after {
112+
content: "";
113+
position: absolute;
114+
top: 100%;
115+
right: 30px;
116+
border: 13px solid transparent;
117+
border-top-color: rgba(0, 0, 0, 0.04);
118+
}
119+
120+
.learn-bar > .learn {
121+
position: absolute;
122+
width: 272px;
123+
top: 8px;
124+
left: -300px;
125+
padding: 10px;
126+
border-radius: 5px;
127+
background-color: rgba(255, 255, 255, 0.6);
128+
transition-property: left;
129+
transition-duration: 500ms;
130+
}
131+
132+
@media (min-width: 899px) {
133+
.learn-bar {
134+
width: auto;
135+
padding-left: 300px;
136+
}
137+
138+
.learn-bar > .learn {
139+
left: 8px;
140+
}
141+
}

‎experimental/todomvc-dart-jaspr/dist/out-dart2js-O4/favicon.ico

2.53 KB
Binary file not shown.

0 commit comments

Comments
 (0)