Wie ich eine plattformübergreifende Desktop-Anwendung mit Sufle, Redis und Rost erstellt habe

CloudFlare bietet ein ausgezeichnetes Produkt namens Workers KV, eine weltweit replizierte Schlüsselwertschicht. Es kann Millionen von Schlüssel verarbeiten, von denen auf jede mit extrem geringer Latenz in Arbeitskripten zugegriffen werden kann, unabhängig davon, woher die Anfrage stammt. Die Arbeiter KV sind unglaublich - es ist auch preislich, einschließlich einer großzügigen freien Stufe.

Als langfristiger Benutzer der Cloudflare-Produktlinie fand ich jedoch, dass eine Sache fehlte: lokale Selbstbeobachtung . Ich habe oft Tausende oder sogar Hunderttausende von Schlüssel in meiner Bewerbung und ich möchte oft eine Möglichkeit haben, alle Daten abzufragen, zu sortieren oder einfach zu sehen, was tatsächlich existiert.

Vor kurzem hatte ich die Ehre, Cloudflare anzuschließen! Noch wichtiger ist, dass ich dieses Quartal vor der „Quick -Win -Woche“ (auch bekannt als der wöchentliche Hackathon) beigetreten bin. Da ich (noch nicht) nicht genug Arbeit angesammelt habe, vertrauen Sie mir, ich werde diese Gelegenheit nutzen, um meine Wünsche zu erfüllen.

Lassen Sie mich Ihnen wieder sagen, wie ich die KV-GUI der Arbeiter gebaut habe, eine plattformübergreifende Desktop-Anwendung, die mit Svelte, Redis und Rost erstellt wurde.

Front-End-Anwendungen

Als Webentwickler ist dies ein vertrauter Link. Ich würde es gerne als "einfacher Teil" nennen, aber da Sie alle HTML-, CSS- und JavaScript -Frameworks, Bibliotheken oder Muster verwenden können, ist die Auswahl von Lähmungen leicht zu passieren. Es kann auch bekannt sein. Wenn Sie einen Front-End-Tech-Stapel haben, den Sie mögen, ist das großartig, benutze es! Für diese App habe ich mich für Sufle entschieden, weil es für mich die Dinge wirklich einfach macht und sie einfach hält.

Darüber hinaus möchten wir als Webentwickler alle Tools bei uns tragen. Natürlich kannst du! Auch diese Phase des Projekts unterscheidet sich nicht von einem typischen Entwicklungszyklus für Webanwendungen. Sie können damit rechnen, Garn -Entwickler (oder eine Variante) als Hauptbefehl auszuführen und sich wie zu Hause zu fühlen. Um das "einfache" Thema beizubehalten, habe ich mich entschlossen, Sveltekit, den offiziellen Framework und das Toolkit von Selte für das Erstellen von Anwendungen zu verwenden. Es enthält ein optimiertes Build-System, ein hervorragendes Entwicklererlebnis (einschließlich HMR!), Eine systembasierte Router und alle Funktionen, die sich selbst anbieten.

Als Rahmen, insbesondere eines, das sich selbst um die Werkzeuge kümmert, kann ich SVELTEKIT ermöglicht, nur über meine Anwendung und ihre Anforderungen nachzudenken. In der Tat muss ich nur in Bezug auf die Konfiguration Seltekit angeben, dass ich eine einzelne Seitenanwendung (SPA) erstellen möchte, die nur auf dem Client ausgeführt wird. Mit anderen Worten, ich muss explizit von Sveltekit abschließen, unter der Annahme, dass ich einen Server möchte, was tatsächlich eine angemessene Annahme ist, da die meisten Anwendungen von der serverseitigen Darstellung profitieren können. Dies ist so einfach wie das Anbringen des @sveltejs/adapter-statischen Pakets, eine speziell für diesen Zweck erstellte Konfiguration. Nach der Installation sieht meine gesamte Konfigurationsdatei so aus:

 <code>// svelte.config.js import preprocess from 'svelte-preprocess'; import adapter from '@sveltejs/adapter-static'; /** @type {import('@sveltejs/kit').Config} */ const config = { preprocess: preprocess(), kit: { adapter: adapter({ fallback: 'index.html' }), files: { template: 'src/index.html' } }, }; export default config;</code>

Änderungen zu index.html sind meine persönliche Präferenz. Sveltekit verwendet app.html als Standard -Grundvorlage, aber alte Gewohnheiten sind schwer zu ändern.

In nur wenigen Minuten wusste meine Toolchain bereits, dass es ein Spa baute, bereits einen Router bereitete und einen Entwicklungsserver bereit war, um verfügbar zu sein. Darüber hinaus sind Typscript-, Postcss- und/oder SASS-Support aufgrund von schlanken Präcess erhältlich, wenn ich möchte (und ich möchte es). Bereit!

Die Anwendung erfordert zwei Ansichten:

1. Bildschirm zum Eingeben von Verbindungsdetails (Standard-/Begrüßungs-/Startseite)
2. Der Bildschirm, auf dem Daten tatsächlich angezeigt werden

In der Welt -Welt -Welt führt dies in zwei "Router", die Sveltekit festlegen, dass diese Routen als SRC/Routes/Index.svelt (Homepage) und SRC/Routes/Viewer.svelt (Data Viewer -Seite) vorhanden sein sollten. In einer realen Webanwendung wird die zweite Route der URL /Viewer -URL zugeordnet. Dies ist zwar immer noch der Fall, aber ich weiß, dass meine Desktop -Anwendung keine Navigationsleiste hat, was bedeutet, dass die URL unsichtbar ist ... es bedeutet, dass es egal ist, wie ich diese Route nenne, solange es für mich Sinn macht.

Der Inhalt dieser Dateien ist zumindest für diesen Artikel meist irrelevant. Für diejenigen, die neugierig sind, ist das gesamte Projekt Open Source, und wenn Sie nach Beispiele von Svelte oder Suflekit suchen, können Sie es gerne auschecken. Auf das Risiko, wie ein gebrochener Datensatz zu sein, ist der Punkt hier, dass ich eine normale Webanwendung erstelle.

Zu diesem Zeitpunkt entwerfe ich nur meine Ansichten und werfe falsche, hartcodierte Daten um, bis ich etwas bekomme, das gültig aussieht. Ich blieb ungefähr zwei Tage hier, bis alles wunderschön aussah und die gesamte Interaktivität (Schaltflächenklicks, Formulareinreichungen usw.) perfektioniert wurde. Ich würde es als "ablaufbare" Anwendung oder Modell nennen.

Desktop -Anwendungswerkzeuge

Zu diesem Zeitpunkt existiert bereits ein voll funktionsfähiges Spa. Es läuft in einem Webbrowser - und wird in einem Webbrowser entwickelt. Vielleicht ist dies im Gegensatz zur Intuition ein perfekter Kandidat für Desktop -Anwendungen! Aber wie geht es mir?

Sie haben vielleicht von Elektron gehört. Es ist das berühmteste Tool zum Erstellen von plattformübergreifenden Desktop-Anwendungen mithilfe von Webtechnologie. Es gibt viele sehr beliebte und erfolgreiche Anwendungen: Visual Studio Code, WhatsApp, Atom und Slack, um nur einige zu nennen. Es bündelt Ihre Webressourcen mit einer eigenen Chrominstallation und einer eigenen Laufzeit von Node.js. Mit anderen Worten, wenn Sie eine elektronenbasierte Anwendung installieren, verfügt sie mit einem zusätzlichen Chrome-Browser und einem vollständigen Satz von Programmiersprachen (Node.js). Diese sind in den Anwendungsinhalt eingebettet und können nicht vermieden werden, da dies Abhängigkeiten der Anwendung sind, um sicherzustellen, dass sie überall konsequent ausgeführt werden. Wie Sie sich vorstellen können, gibt es einige Kompromisse für diesen Ansatz - die Anwendung ist ziemlich groß (d. H. Über 100 MB) und verwendet viele Systemressourcen, um auszuführen. Um die App zu verwenden, führt der Hintergrund ein brandneues/separates Chrome aus - das nicht genau das gleiche wie das Öffnen einer neuen Registerkarte entspricht.

Glücklicherweise gibt es einige Alternativen - ich habe Svelte Nodegui und Tauri bewertet. Beide Optionen bieten eine erhebliche Anwendungsgröße und Nutzungseinsparung, indem sie sich auf native Renderer verlassen, die vom Betriebssystem bereitgestellt werden, anstatt eine Kopie von Chrome einzubetten. NodeGui tut dies, indem sie sich auf QT verlassen, ein anderes Desktop/GUI -Anwendungsframework, das in native Ansichten zusammengestellt wurde. Dazu muss NodeGui jedoch einige Änderungen an Ihrem Anwendungscode vornehmen, damit Ihre Komponenten in QT -Komponenten umwandeln können. Ich glaube zwar, dass dies sicherlich funktionieren wird, aber ich interessiere mich nicht für diese Lösung, da ich genau das verwenden möchte, was ich weiß, ohne dass ich an meinen schlanken Dateien angepasst habe. Im Gegensatz dazu erzählt Tauri seine Einsparungen, indem er den nativen WebViewer des Betriebssystems einwickelt-beispielsweise Cocoa/Webkit auf MacOS, GTK-Webkit2 unter Linux und Webkit on Edge unter Windows. WebViewers sind tatsächlich Browser, und Tauri verwendet sie, weil sie bereits in Ihrem System vorhanden sind. Dies bedeutet, dass unsere Anwendungen nur Webentwicklungsprodukte bleiben können.

Mit diesen Einsparungen beträgt die kleinste Tauri -App weniger als 4 MB und das durchschnittliche App -Gewicht weniger als 20 MB. In meinen Tests wiegt die kleinste NodeGui -Anwendung etwa 16 MB. Die kleinste Elektronenanwendung kann problemlos 120 MB erreichen.

Unnötig zu erwähnen, dass ich Tauri entschieden habe. Durch die Befolgung des Tauri-Integrationshandbuchs habe ich das @tauri-Apps/CLI-Paket in DevDependenzen hinzugefügt und das Projekt initialisiert:

 <code>yarn add --dev @tauri-apps/cli yarn tauri init</code>

Dadurch wird ein SRC-Tauri-Verzeichnis neben dem SRC-Verzeichnis erstellt (in dem sich die SufleTe-Anwendung befindet). Hier befinden sich alle Tauri-spezifischen Dateien, die sich hervorragend für die Organisation eignen.

Ich habe noch nie eine Tauri-App erstellt, aber nachdem ich mich in der Konfigurationsdokumentation angesehen habe, kann ich die meisten Standardwerte beibehalten- mit Ausnahme von Elementen wie Paket.ProductName und Windows.Title-Werten natürlich. Tatsächlich ist die einzige Änderung, die ich vornehmen muss , die Build -Konfiguration, die für Entwicklungs- und Ausgabeinformationen mit Seltekit ausgerichtet werden muss:

 <code>// src-tauri/tauri.conf.json { "package": { "version": "0.0.0", "productName": "Workers KV" }, "build": { "distDir": "../build", "devPath": "http://localhost:3000", "beforeDevCommand": "yarn svelte-kit dev", "beforeBuildCommand": "yarn svelte-kit build" }, // ... }</code>

Distir bezieht sich auf den Ort des gebauten produktionsbereiten Vermögenswerts. Dieser Wert wird aus dem Ort der Datei tauri.conf.json analysiert, sodass er das Präfix enthält.

DevPath ist die URL, die während der Entwicklung vervollständigt wird. Standardmäßig generiert SVELTEKIT einen Entwicklungsserver (konfigurierbar) auf Port 3000. Ich habe in der ersten Phase auf die Adresse von Localhost: 3000 im Browser zugegriffen, daher ist dies nicht anders.

Schließlich hat Tauri einen eigenen Entwickler und baute Befehle. Um den Ärger zu vermeiden, mehrere Befehle zu bearbeiten oder Skripte zu erstellen, stellt Tauri die Befragten -Haken und die Vorbauer -Hooks bereit, sodass Sie einen Befehl ausführen können, bevor der Befehl tauri ausgeführt wird. Dies ist eine subtile, aber leistungsstarke Bequemlichkeit!

Auf die Sveltekit-CLI kann über den Binärnamen Svelt-Kit zugegriffen werden. Zum Beispiel wird das Schreiben von Yarn-Svelte-Kit-Build das Yarn anweisen, seine lokale Seltiere-Kit-Binärdehnung (über DevDependency installiert) zu erhalten, und dann SufleTekit mitzuteilen, dass er seinen Build-Befehl ausführen soll.

Damit enthält mein Root-Level-Paket.json das folgende Skript:

 <code>{ "private": true, "type": "module", "scripts": { "dev": "tauri dev", "build": "tauri build", "prebuild": "premove build", "preview": "svelte-kit preview", "tauri": "tauri" }, // ... "devDependencies": { "@sveltejs/adapter-static": "1.0.0-next.9", "@sveltejs/kit": "1.0.0-next.109", "@tauri-apps/api": "1.0.0-beta.1", "@tauri-apps/cli": "1.0.0-beta.2", "premove": "3.0.1", "svelte": "3.38.2", "svelte-preprocess": "4.7.3", "tslib": "2.2.0", "typescript": "4.2.4" } }</code>

Nach der Integration ist mein Produktionsbefehl immer noch Garn Build, das Tauri Build aufruft, um die Desktop-Anwendung tatsächlich zu bündeln, jedoch erst nach dem erfolgreichen Abschluss des Garn-Svelte-Kit-Builds (über die Option "Vorbauercommand). Mein Entwicklungsbefehl ist immer noch Yarn Dev, bei dem Tauri Dev und Garn Svelte-Kit Dev-Befehle parallel ausgeführt werden. Der Entwicklungs -Workflow befindet sich vollständig in der Tauri -Anwendung und nimmt jetzt localhost: 3000 vor, so dass ich immer noch die Vorteile des HMR -Entwicklungsservers erhalten kann.

Wichtig: Tauri ist zum Zeitpunkt des Schreibens noch in der Beta. Das heißt, es fühlt sich sehr stabil und gut geplant an. Ich habe keine Verbindung mit dem Projekt, aber es sieht so aus, als würde Tauri 1.0 wahrscheinlich bald zu einer stabilen Version gehen. Ich fand Tauri Discord sehr aktiv und hilfsbereit, einschließlich der Antworten von Tauri -Betreuern! Sie beantworteten sogar einige meiner Rost -Neulinge während des gesamten Prozesses. :)

Verbindung zu Redis herstellen

Zu diesem Zeitpunkt war es Mittwochnachmittag in der schnellen Siegerwoche und ich fing ehrlich gesagt nervös, es vor der Freitag -Team -Demo zu beenden. Warum? Seit ich die Hälfte der Woche verbracht habe, auch wenn ich ein gut aussehendes Spa in einer laufbaren Desktop-Anwendung habe, macht es immer noch nichts . Ich habe mir die ganze Woche über die gleichen gefälschten Daten angesehen.

Sie denken vielleicht, dass ich, weil ich auf die WebView zugreifen kann, Fetch () verwenden kann, um einige authentifizierte REST -API -Forderungen für die gewünschten KV -Daten zu erstellen und alles in eine lokale Stor- oder IndexedDB -Tabelle zu geben ... Sie sind völlig korrekt! Dies ist jedoch nicht meine Idee für Desktop -Anwendungswendungsfälle.

Es ist absolut machbar, alle Ihre Daten in einem In-Browser-Speicher zu speichern, aber es speichert sie lokal in Ihrem Computer . Dies bedeutet, dass wenn Ihre Teammitglieder versuchen, dasselbe zu tun, jeder alle Daten auf seiner eigenen Maschine erhalten und speichern muss. Im Idealfall sollte diese KV -Anwendung dieser Arbeitnehmer die Möglichkeit haben, eine Verbindung zu einer externen Datenbank herzustellen und zu synchronisieren. Auf diese Weise kann sich jeder bei der Arbeit in einem Team -Setup auf denselben Datenbank -Cache anpassen, um Zeit zu sparen - und etwas Geld. Dies wird wichtig, wenn es um Millionen von Schlüssel zu tun hat, was, wie bereits erwähnt, bei der Verwendung von Arbeitern KV nicht ungewöhnlich ist.

Nachdem ich eine Weile darüber nachgedacht hatte, entschied ich mich, Redis als Backend -Speicher zu verwenden, da es sich auch um einen wichtigen Wertspeicher handelt . Dies ist großartig, weil Redis die Schlüssel bereits als erstklassige Bürger behandelt und das Sortier- und Filterverhalten bietet, das ich möchte (das heißt, ich kann die Arbeit bestehen, anstatt sie selbst zu implementieren!). Dann ist Redis natürlich einfach zu installieren und in Containern zu laufen, und wenn jemand diese Route beschließt, gibt es viele gehostete Redis als Dienstleister.

Aber wie verbinde ich mich damit? Meine App ist im Grunde genommen ein Browser -Tag, das Svelte läuft, oder? Ja - aber es ist auch viel mehr als das.

Wie Sie sehen können, ist der Erfolg von Electron, ja, es garantiert, dass Webanwendungen bei jedem Betriebssystem gut abschneiden, aber auch die Laufzeit von Node.js bringt. Als Webentwickler ist es ähnlich, dass ein Backend -API direkt in meinen Kunden einbezieht. Grundsätzlich verschwindet das Problem "... aber es läuft auf meinem Computer", weil alle Benutzer (unbewusst) genau die gleichen Lokalhost -Einstellungen ausführen. Über die Node.js-Ebene können Sie mit dem Dateisystem interagieren, den Server auf mehreren Ports ausführen oder eine Reihe von NODE_MODULES einfügen, um hier nur beiläufig mit der Redis-Instanz zu vernichten. Kraftvolles Zeug.

Wir werden diese Supermacht nicht verlieren, weil wir Tauri verwenden! Es ist dasselbe, aber etwas anders.

Anstatt die Laufzeit von Node.js einzubeziehen, wird die Tauri-Anwendung mit Rost, einer Systemsprache auf niedriger Ebene, erstellt. So interagiert Tauri selbst mit dem Betriebssystem und "leiht" seine native WebViewer. Alle Tauri -Toolkits werden zusammengestellt (über Rost), wodurch die gebauten Anwendungen klein und effizient bleiben. Dies bedeutet jedoch auch, dass wir , Anwendungsentwickler, jede andere Kiste (das "NPM -Modul" gleichwertig) in die gebaute Anwendung einbeziehen können. Natürlich gibt es auch eine gut benannte Rediskiste, die als Redis-Client-Treiber fungiert, mit dem die KV-GUI der Arbeitnehmer eine Verbindung zu einer beliebigen Redis-Instanz herstellen kann.

In Rust ähnelt die Datei Cargo.toml unserer Paket.json -Datei. Hier werden Abhängigkeiten und Metadaten definiert. Im Tauri-Setup befindet es sich in Src-Tauri/Cargo.toml, da sich wieder alles mit Tauri in diesem Verzeichnis befindet. Cargo hat auch das Konzept der auf der Abhängigkeitsebene definierten "funktionalen Flags". (Die nächstgelegene Analogie, die ich mir vorstellen kann, ist die Verwendung von NPM, um auf die interne Struktur eines Moduls oder importierten Submodules zuzugreifen, obwohl es immer noch nicht genau gleich ist, da die Feature -Flags bei Rost die Art und Weise beeinflussen, wie das Paket erstellt wird.)

 <code># src-tauri/Cargo.toml [dependencies] serde_json = "1.0" serde = { version = "1.0", features = ["derive"] } tauri = { version = "1.0.0-beta.1", features = ["api-all", "menu"] } redis = { version = "0.20", features = ["tokio-native-tls-comp"] }</code>

Das obige definiert die Rediskiste als Abhängigkeit und wählt die Funktion "Tokio-natives TLS-comp" aus, die laut Dokumentation für die Unterstützung von TLS erforderlich ist.

Ok, also habe ich endlich alles, was ich brauche. Ich muss meinen schlanken Selte mit meinem Redis sprechen lassen, bevor der Mittwoch endet. Nachdem ich mich umgesehen hatte, bemerkte ich, dass alle wichtigen Dinge in der Datei src-tauri/main.rs zu passieren scheinen. Ich habe das Makro #[Befehl] aufgeschrieben und ich weiß, dass ich ihn schon einmal im Tauri -Beispiel des Tages gesehen habe, also habe ich gelernt , die verschiedenen Teile der Beispieldatei zu kopieren, um zu sehen, welche Fehler nach dem Rust -Compiler erscheinen und verschwinden.

Schließlich konnte die Tauri-App erneut ausgeführt werden, und ich erfuhr, dass das Makro #[Befehl] die zugrunde liegenden Funktionen irgendwie einwickelte, damit es die "Kontextwerte" empfangen kann (wenn Sie sie verwenden) und die vorabgestuften Parameterwerte empfangen können. Darüber hinaus führt Rust als Sprache eine Menge Typkonvertierungen durch. Zum Beispiel:

 <code>use tauri::{command}; #[command] fn greet(name: String, age: u8) { println!("Hello {}, {} year-old human!", name, age); }</code>

Dadurch wird ein Grußbefehl erstellt und beim Ausführen zwei Parameter erwartet : Name und Alter. Wenn Sie definiert sind, ist der Namenswert ein Zeichenfolgewert und das Alter ist der U8 -Datentyp - dh eine Ganzzahl. Wenn beide fehlen, wirft Tauri einen Fehler aus, da die Befehlsdefinition nicht angibt, dass etwas optional sein kann.

Um den Befehl tauri tatsächlich an die Anwendung zu verbinden, muss er als Teil der Tauri :: Builder -Kombination in der Hauptfunktion definiert werden.

 <code>use tauri::{command}; #[command] fn greet(name: String, age: u8) { println!("Hello {}, {} year-old human!", name, age); } fn main() { // start composing a new Builder chain tauri::Builder::default() // assign our generated "handler" to the chain .invoke_handler( // piece together application logic tauri::generate_handler![ greet, // attach the command ] ) // start/initialize the application .run( // put it all together tauri::generate_context!() ) // print<message> if error while running .expect("error while running tauri application"); }</message></code>

Die Tauri -Anwendung kompiliert und weiß , dass sie einen "Greet" -Befehl hat. Es steuert auch das WebView (wir haben es bereits besprochen), aber dabei fungiert es als Brücke zwischen dem aktuellen Ende (Webview -Inhalt) und dem Backend, das aus der Tauri -API und jedem anderen Code besteht (wie Greet -Befehle). Mit Tauri können wir Nachrichten zwischen der Brücke senden, damit die beiden Welten miteinander kommunizieren können.

Das Front-End kann auf diese "Brücke" zugreifen, indem sie Funktionen aus einem beliebigen (bereits enthaltenen) @Tauri-Apps-Paket importiert oder sich auf ein Fenster verlassen . Insbesondere interessieren wir uns für den Befehl auf Invoke, der den Befehlsnamen und eine Reihe von Parametern akzeptiert. Wenn es Argumente gibt, muss es als Objekt definiert werden, bei dem der Schlüssel mit dem Parameternamen übereinstimmt, den unsere Rostfunktion erwartet.

In der Svelte -Ebene können wir Folgendes tun, um den in der Rostschicht definierten Befehlsbefehl anzurufen:

 <code>function onclick() { __TAURI__.invoke('greet', { name: 'Alice', age: 32 }); } Click Me</code>

Wenn diese Schaltfläche klickt, wird unser Terminalfenster (in dem der Befehl tauri dev ausgeführt) gedruckt:

 <code>Hello Alice, 32 year-old human!</code>

Dies geschieht wieder, weil die Println! Es erscheint im Konsolenfenster des Terminals - nicht in der Browserkonsole -, da dieser Code immer noch auf der Rost/System -Seite ausgeführt wird.

Es ist auch möglich, einige Inhalte aus dem Befehl tauri an den Client zu senden. Wechseln Sie also schnell den Greet:

 <code>use tauri::{command}; #[command] fn greet(name: String, age: u8) { // implicit return, because no semicolon! format!("Hello {}, {} year-old human!", name, age) } // OR #[command] fn greet(name: String, age: u8) { // explicit `return` statement, must have semicolon return format!("Hello {}, {} year-old human!", name, age); }</code>

Als ich merkte, dass ich auf Invoke anrufen werde und ein wenig faul bin, habe ich einen leichten Client -Assistenten extrahiert, um diese zu integrieren:

 <code>// @types/global.d.ts ///<reference types="@sveltejs/kit"></reference> type Dict<t> = Record<string t=""> ; declare const __TAURI__: { invoke: typeof import('@tauri-apps/api/tauri').invoke; } // src/lib/tauri.ts export function dispatch(command: string, args: Dict<string> ) { return __TAURI__.invoke(command, args); }</string></string></t></code>

Dann refactor den vorherigen Begrüßer.

 <code>import { dispatch } from '$lib/tauri'; async function onclick() { let output = await dispatch('greet', { name: 'Alice', age: 32 }); console.log('~>', output); //=> "~> Hello Alice, 32 year-old human!" } Click Me</code>

wunderbar! Es ist also Donnerstag und ich habe noch keinen Redis -Code geschrieben, aber zumindest weiß ich, wie man die beiden Hälften des Gehirns der Anwendung miteinander verbindet. Es ist Zeit, den Client -Code zu durchkämmen und alle Todos im Ereignishandler zu ersetzen und sie mit dem tatsächlichen Inhalt zu verbinden.

Ich werde die Details hier weglassen, denn von hier aus ist es sehr anwendungsspezifisch - und hauptsächlich über die Geschichte des Rost -Compilers, der mir einen Schlag bringt. Darüber hinaus ist das Erkunden von Details genau der Grund, warum das Projekt Open Source ist!

Auf einer hohen Ebene kann auf die Synchronisierungs -Taste auf eine Redisverbindung auf der Strecke /Betrachter zugegriffen werden. Wenn diese Schaltfläche klickt (und nur dann - aufgrund der Kosten), wird eine JavaScript -Funktion aufgerufen, die für die Verbindung zu der CloudFlare -REST -API verantwortlich ist und den Befehl "redis_set" für jeden Taste entsendet. Dieser Befehl redis_set ist in der Rust-Schicht definiert-wie alle auf Redis-basierten Befehle-und ist dafür verantwortlich, dass sie tatsächlich Schlüsselwertpaare in Redis schreiben.

Das Lesen von Daten aus Redis ist ein sehr ähnlicher Prozess, genau umgekehrt. Wenn /Viewer beispielsweise startet, sollten alle Schlüssel aufgelistet und bereit sein. In der Sufelte -Terminologie muss ich den Befehl Tauri planen, wenn die /Viewer -Komponente installiert ist. Dies passiert hier fast wörtlich. Klicken Sie auf den Schlüsselnamen in der Seitenleiste anzeigen mehr "Details" zum Schlüssel, einschließlich seiner Ablaufzeit (falls vorhanden), der Metadaten (falls vorhanden) und dessen tatsächlicher Wert (falls bekannt). Um die Kosten und die Netzwerkbelastung zu optimieren, haben wir beschlossen, dass wir nur nach Bedarf den Wert des Schlüssels erhalten sollten. Dadurch wird die Schaltfläche Aktualisierung eingeführt, die beim Klicken erneut mit der Rest -API interagiert und dann einen Befehl plant, damit der Redis -Client den Schlüssel einzeln aktualisieren kann.

Ich versuche nicht, hastig zu enden, aber sobald Sie eine erfolgreiche Interaktion zwischen JavaScript und Rostcode sehen, sehen Sie alle Interaktionen! Der Rest meines Donnerstag- und Freitagsmorgens definiert nur neue Anfragen, die sich so sehr wie das Senden von Ping- und Pong-Nachrichten anfühlen.

abschließend

Für mich - ich denke, für viele andere JavaScript -Entwickler - die Herausforderung in dieser Woche besteht darin, Rost zu lernen. Ich glaube, Sie haben das schon einmal gehört, und Sie werden es in Zukunft auf jeden Fall wieder hören. Die Eigentümerregeln, Ausleihenprüfungen und die Bedeutung von Single-Charakter-Syntaxmarkierungen (diese Marker sind übrigens nicht einfach zu suchen) sind nur einige Hindernisse, denen ich begegnet bin. Nochmals vielen Dank Tauri Discord für seine Hilfe und Freundlichkeit!

Dies bedeutet auch, dass die Verwendung von Tauri keine Herausforderung ist - es ist eine große Erleichterung. Ich bin mir sicher, dass ich in Zukunft wieder Tauri verwenden möchte, insbesondere wenn ich weiß, dass ich nur WebViewer verwenden kann, wenn ich möchte. Das Graben in und/oder Hinzufügen von Rostabschnitten ist "zusätzliches Material" und muss nur dann erforderlich sind, wenn meine Anwendung dies erfordert.

Für diejenigen, die es wissen wollen, weil ich keinen anderen Ort finden kann, um ihn zu erwähnen: Auf MacOS wiegt die KV -GUI -App der Arbeiter weniger als 13 MB. Ich freue mich sehr über dieses Ergebnis!

Natürlich ermöglicht Seltekit diesen Zeitplan. Es hat mir nicht nur einen halben Tag der Konfiguration des Werkzeuggürtels gespart, sondern der sofortige HMR -Entwicklungsserver kann mir auch mehrere Stunden lang den Browser manuell erfrischen - und dann den Tauri -Betrachter.

Wenn Sie es hier gesehen haben-ist es beeindruckend! Vielen Dank für Ihre Zeit und Aufmerksamkeit. Zur Erinnerung ist das Projekt auf Github verfügbar, und die neuesten vorkompilierten Binärdateien sind immer über seine Veröffentlichungsseite verfügbar.

Das obige ist der detaillierte Inhalt vonWie ich eine plattformübergreifende Desktop-Anwendung mit Sufle, Redis und Rost erstellt habe. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!