nanoshell 1.1.5 → 1.1.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +30 -1
- package/cli/main.zig +30 -0
- package/example_app/app.js +26 -2
- package/package.json +1 -1
- package/zig-out/bin/nanoshell.exe +0 -0
package/README.md
CHANGED
|
@@ -61,10 +61,11 @@ Build binary and generate Windows installer (`dist/MyApp-Setup.exe` powered by *
|
|
|
61
61
|
|
|
62
62
|
```text
|
|
63
63
|
my-awesome-app/
|
|
64
|
-
├──
|
|
64
|
+
├── app/
|
|
65
65
|
│ ├── index.html <-- Standard HTML markup
|
|
66
66
|
│ ├── styles.css <-- Standard CSS (Flexbox, Grid, Glassmorphism)
|
|
67
67
|
│ └── app.js <-- Application JavaScript logic
|
|
68
|
+
├── nanoshell.json <-- App manifest & FPS overlay configuration
|
|
68
69
|
├── resources/
|
|
69
70
|
│ ├── icudt67l.dat <-- Unicode ICU data
|
|
70
71
|
│ └── cacert.pem <-- SSL certificates
|
|
@@ -74,6 +75,34 @@ my-awesome-app/
|
|
|
74
75
|
|
|
75
76
|
---
|
|
76
77
|
|
|
78
|
+
## ⚡ Universal CPU Architecture & Hardware Compatibility
|
|
79
|
+
|
|
80
|
+
NanoShell binaries are built using the **`x86_64-windows-baseline` CPU target architecture**, ensuring universal hardware compatibility across all 64-bit Windows laptops and PCs without throwing `illegal instruction` hardware panics on older processors.
|
|
81
|
+
|
|
82
|
+
---
|
|
83
|
+
|
|
84
|
+
## 📊 Real-Time FPS Overlay Control (`nanoshell.json`)
|
|
85
|
+
|
|
86
|
+
You can control real-time FPS overlay rendering directly inside your app's `nanoshell.json` manifest:
|
|
87
|
+
|
|
88
|
+
```json
|
|
89
|
+
{
|
|
90
|
+
"name": "My Awesome App",
|
|
91
|
+
"version": "1.0.0",
|
|
92
|
+
"exe_name": "my_app.exe",
|
|
93
|
+
"show_fps": true,
|
|
94
|
+
"window": {
|
|
95
|
+
"width": 1280,
|
|
96
|
+
"height": 720
|
|
97
|
+
}
|
|
98
|
+
}
|
|
99
|
+
```
|
|
100
|
+
|
|
101
|
+
- `"show_fps": true` — Displays a sleek real-time 120 FPS counter overlay in the top-right corner.
|
|
102
|
+
- `"show_fps": false` — Hides the FPS counter overlay.
|
|
103
|
+
|
|
104
|
+
---
|
|
105
|
+
|
|
77
106
|
## 🎨 Writing HTML & CSS
|
|
78
107
|
|
|
79
108
|
Developers write standard web code inside `assets/`. NanoShell automatically polyfills flex gaps, handles High-DPI scaling, and trims memory working sets in the background.
|
package/cli/main.zig
CHANGED
|
@@ -129,6 +129,7 @@ pub fn main() !void {
|
|
|
129
129
|
\\</head>
|
|
130
130
|
\\<body>
|
|
131
131
|
\\ <div class="container">
|
|
132
|
+
\\ <div class="fps-badge"><span id="fps-val">60</span> FPS Realtime</div>
|
|
132
133
|
\\ <h1>⚡ NanoShell Desktop App</h1>
|
|
133
134
|
\\ <p>Ultra-lightweight WebKit desktop runtime</p>
|
|
134
135
|
\\ <button id="btn">Click Me</button>
|
|
@@ -151,12 +152,24 @@ pub fn main() !void {
|
|
|
151
152
|
\\ height: 100vh;
|
|
152
153
|
\\}
|
|
153
154
|
\\.container {
|
|
155
|
+
\\ position: relative;
|
|
154
156
|
\\ text-align: center;
|
|
155
157
|
\\ background: #1e293b;
|
|
156
158
|
\\ padding: 2.5rem;
|
|
157
159
|
\\ border-radius: 1rem;
|
|
158
160
|
\\ box-shadow: 0 10px 25px rgba(0,0,0,0.5);
|
|
159
161
|
\\}
|
|
162
|
+
\\.fps-badge {
|
|
163
|
+
\\ position: absolute;
|
|
164
|
+
\\ top: 1rem;
|
|
165
|
+
\\ right: 1rem;
|
|
166
|
+
\\ font-size: 0.75rem;
|
|
167
|
+
\\ font-weight: bold;
|
|
168
|
+
\\ color: #38bdf8;
|
|
169
|
+
\\ background: rgba(56, 189, 248, 0.1);
|
|
170
|
+
\\ padding: 0.25rem 0.5rem;
|
|
171
|
+
\\ border-radius: 0.25rem;
|
|
172
|
+
\\}
|
|
160
173
|
\\button {
|
|
161
174
|
\\ background: #38bdf8;
|
|
162
175
|
\\ color: #0f172a;
|
|
@@ -171,6 +184,23 @@ pub fn main() !void {
|
|
|
171
184
|
try app_dir.writeFile(io, .{ .sub_path = "app/styles.css", .data = css_content });
|
|
172
185
|
|
|
173
186
|
const js_content =
|
|
187
|
+
\\let lastTime = performance.now();
|
|
188
|
+
\\let frames = 0;
|
|
189
|
+
\\function calcFps() {
|
|
190
|
+
\\ const now = performance.now();
|
|
191
|
+
\\ frames++;
|
|
192
|
+
\\ const delta = now - lastTime;
|
|
193
|
+
\\ if (delta >= 500) {
|
|
194
|
+
\\ const fps = Math.round((frames * 1000) / delta);
|
|
195
|
+
\\ const el = document.getElementById('fps-val');
|
|
196
|
+
\\ if (el) el.innerText = fps;
|
|
197
|
+
\\ frames = 0;
|
|
198
|
+
\\ lastTime = now;
|
|
199
|
+
\\ }
|
|
200
|
+
\\ requestAnimationFrame(calcFps);
|
|
201
|
+
\\}
|
|
202
|
+
\\requestAnimationFrame(calcFps);
|
|
203
|
+
\\
|
|
174
204
|
\\document.getElementById('btn').addEventListener('click', () => {
|
|
175
205
|
\\ alert('Hello from NanoShell!');
|
|
176
206
|
\\});
|
package/example_app/app.js
CHANGED
|
@@ -2,7 +2,30 @@
|
|
|
2
2
|
|
|
3
3
|
console.log("[ZeroUI App] Initializing Showcase Application...");
|
|
4
4
|
|
|
5
|
-
// 1.
|
|
5
|
+
// 1. Real-Time Hardware Delta FPS Counter Algorithm
|
|
6
|
+
let lastFrameTime = performance.now();
|
|
7
|
+
let frameCount = 0;
|
|
8
|
+
let currentFps = 60;
|
|
9
|
+
|
|
10
|
+
function updateRealTimeFps() {
|
|
11
|
+
const now = performance.now();
|
|
12
|
+
frameCount++;
|
|
13
|
+
const delta = now - lastFrameTime;
|
|
14
|
+
|
|
15
|
+
if (delta >= 500) { // Update display every 500ms for smooth reading
|
|
16
|
+
currentFps = Math.round((frameCount * 1000) / delta);
|
|
17
|
+
frameCount = 0;
|
|
18
|
+
lastFrameTime = now;
|
|
19
|
+
|
|
20
|
+
const fpsEl = document.getElementById("fps-counter");
|
|
21
|
+
if (fpsEl) {
|
|
22
|
+
fpsEl.innerText = `${currentFps} FPS Realtime`;
|
|
23
|
+
}
|
|
24
|
+
}
|
|
25
|
+
requestAnimationFrame(updateRealTimeFps);
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
// 2. Query Native System Metrics via NanoShell / ZeroUI Native OS Bridge
|
|
6
29
|
function refreshSystemStats() {
|
|
7
30
|
const ns = (typeof NanoShell !== "undefined") ? NanoShell : ((typeof ZeroUI !== "undefined") ? ZeroUI : null);
|
|
8
31
|
if (ns && ns.sys) {
|
|
@@ -18,10 +41,11 @@ function refreshSystemStats() {
|
|
|
18
41
|
}
|
|
19
42
|
}
|
|
20
43
|
|
|
21
|
-
//
|
|
44
|
+
// 3. Bind Button Click Events & Start FPS Loop
|
|
22
45
|
document.addEventListener("DOMContentLoaded", () => {
|
|
23
46
|
console.log("[ZeroUI App] DOM Fully Loaded.");
|
|
24
47
|
refreshSystemStats();
|
|
48
|
+
requestAnimationFrame(updateRealTimeFps);
|
|
25
49
|
|
|
26
50
|
// Refresh Diagnostics
|
|
27
51
|
const btnRefresh = document.getElementById("btn-refresh");
|
package/package.json
CHANGED
|
Binary file
|