Devtools (reactive graph visualization) in the playground

Abierto
  • ¿Algo no está bien?
#117 2 comentarios 0 reacciones 0 asignados Ver en GitHub

Nadie ha tomado este issue todavía.

  • #124 de @thetarnav — cerrado sin fusionar

Evaluación

Dificultad
5/5
Tiempo estimado
Más de una semana
Aptitud para principiantes
20/100
Tipo de issue
Nueva funcionalidad
Claridad
Necesita aclaración
Estado de actividad
Estancado
Stack tecnológico
babel, typescript
Área
developer-experience, frontend, tooling

Línea de trabajo

Comienza revisando cómo se ejecuta actualmente el playground en modo de producción y cómo está estructurada su UI. Después, examina los paquetes vinculados de debugger y Babel transform para identificar los puntos de integración y los bloqueadores del seguimiento del grafo. El trabajo estaría terminado cuando se hayan decidido una arquitectura y un plan de implementación para el modo dev, la conexión del debugger, las transformaciones opcionales y el panel del grafo.

Escrito por el modelo de indexación a partir del texto del issue.

Descripción

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.

Lenguaje dominante
TypeScript
Estrellas
246
Forks
71
Merge medio
5 min
PR fusionados (30 d)
5

Preparar el entorno

Primeros pasos

  1. Lee el issue completo y luego la guía de contribución del proyecto.
  2. Comenta en el issue que vas a ocuparte — evita que dos personas hagan lo mismo.
  3. Haz un fork del repositorio y trabaja en una rama.
  4. Abre un pull request que haga referencia al número del issue.

Más de solidjs/solid-playground

Todos los issues de solidjs/solid-playground

Issues similares

Más issues de TypeScript

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.