Vueable-query

Vueable Query Logo

Vueable Query is an easy to use Chrome Extension that provides visualization and performance metrics for programs using Tanstack Query for Vue.

Installation

  • Fork this repository
  • Run npm install then npm run build to build the extension to the dist folder
  • In chrome, navigate to extension then load unpacked and select the dist folder

Features

demo

  • A timeline to visualize the query history
  • A text panel to display all relevant queries under their query key.
  • Highlighting on click and hover
  • Tooltip displayed on hover

Example Program

  • Run with npm run demo
  • Navigate to localhost:5173

Usage

  • View a program running Tanstack Query for Vue or load up the example program above
  • Open up the Dev Tools for Chrome
  • Navigate to Vueable Query pane

GitHub

View Github