Devtools (reactive graph visualization) in the playground

Offen
  • Stimmt etwas nicht?
#117 2 Kommentare 0 Reaktionen 0 zugewiesene Personen Auf GitHub ansehen

Dieses Issue hat noch niemand übernommen.

  • #124 von @thetarnav — ohne Merge geschlossen

Bewertung

Schwierigkeit
5/5
Geschätzter Aufwand
Über eine Woche
Anfängerfreundlichkeit
20/100
Issue-Typ
Feature
Klarheit
Muss geklärt werden
Aktivitätsstatus
Veraltet
Tech-Stack
babel, typescript
Bereich
developer-experience, frontend, tooling

Rechercherichtung

Beginne damit zu prüfen, wie der Playground derzeit im Produktionsmodus ausgeführt wird und wie seine UI strukturiert ist. Untersuche anschließend die verlinkten Debugger- und Babel-Transform-Pakete, um die Integrationspunkte und Blocker für die Graph-Verfolgung zu identifizieren. Als abgeschlossen gilt die Aufgabe, wenn eine Architektur und ein Implementierungsplan für den Dev-Modus, die Debugger-Anbindung, optionale Transforms und das Graph-Panel festgelegt wurden.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Beschreibung

I don't have anything prepared—this is just theoretical, but would it be possible to include a reactive graph debugger in the playground in the future?
One thing for certain—it would require the playground to work in a dev mode. And from what I know, it works in prod mode currently. This alone might just prevent this from happening. But would there be any other blockers?
This idea just popped into my head, and I wanted to ask if it would make sense and what should I take into consideration when architecting the devtools if it does.
Besides the solid operating in dev mode requirement, there are three parts of the devtools that I would need to think, about how'd they fit in:

  • the debugger - the debugger would need to be attached to the application in the background, for the devtools to be able to get and track the state of the graph
  • babel transforms - this one is not necessary, but useful, it'll allow for things like tracking stores, automatically naming signals/memos/stores, and tracking component props.
  • the devtools/graph panel - part of the UI would need to be reserved for the devtools - for displaying the graph, toggling is on and off, configuring, etc.

I'm currently writing the devtools in a way that theoretically should allow it to be used in various places—not limited to the chrome extension. But some changes might be necessary. It's definitely not ready now. Not even close.
Still, I think it would be great to see the graph right in the playground eventually. So I just wanted to know what you think.

Vorherrschende Sprache
TypeScript
Sterne
246
Forks
71
Ø Merge
5 Min.
Gemergte PRs (30 T.)
6

Entwicklungsumgebung

Erste Schritte

  1. Lesen Sie das ganze Issue und danach den Beitragsleitfaden des Projekts.
  2. Schreiben Sie ins Issue, dass Sie es übernehmen — das erspart doppelte Arbeit.
  3. Forken Sie das Repository und arbeiten Sie in einem Branch.
  4. Öffnen Sie einen Pull Request, der die Issue-Nummer nennt.

Mehr aus solidjs/solid-playground

Alle Issues in solidjs/solid-playground

Ähnliche Issues

Weitere Issues zu TypeScript

Neue Issues direkt in Ihr Postfach

Eine kurze Übersicht über anfängerfreundliche GitHub-Issues.