- Notifications
You must be signed in to change notification settings - Fork1
Postgres Explain Visualizer 2
License
pxlapp/pg-explain
Folders and files
| Name | Name | Last commit message | Last commit date | |
|---|---|---|---|---|
Repository files navigation
PEV2: A VueJS component to show a graphical vizualization of a PostgreSQL executionplan.
To use the explain vizualizer you can choose one of the following options:
This service is provided byDalibo and can help you to share your plans withcolleagues or customers.
PEV2 can be run locally without any external internet resource.
Simply downloadindex.html,open it in your favorite internet browser.
<scriptsrc="https://unpkg.com/vue@3.2.37/dist/vue.global.prod.js"></script><scriptsrc="https://unpkg.com/pev2/dist/pev2.umd.js"></script><linkhref="https://unpkg.com/bootstrap@4.5.0/dist/css/bootstrap.min.css"rel="stylesheet"/><linkrel="stylesheet"href="https://unpkg.com/pev2/dist/style.css"/><divid="app"><pev2:plan-source="plan"plan-query=""/></div><script>const{ createApp}=Vueconstplan="Seq Scan on foo (cost=0.00..155.00 rows=10000 width=4)"constapp=createApp({data(){return{plan:plan,}},})app.component("pev2",pev2.Plan)app.mount("#app")</script>
For a complete example, seethis codesandbox
PEV2 can be integrated as a component in a web application.
Install it:
npm install pev2Declare thePEV2 component and use it:
import{Plan}from"pev2"import"pev2/dist/style.css"exportdefault{name:"PEV2 example",components:{pev2:Plan,},data(){return{plan:plan,query:query,}},}
Then add thePEV2 component to your template:
<divid="app"><pev2:plan-source="plan":plan-query="query"></pev2></div>
PEV2 requiresBootstrap (CSS) to work so don't forget toadd the following in you header (or load them with your favorite bundler).
<linkhref="https://unpkg.com/bootstrap@4.5.0/dist/css/bootstrap.min.css"rel="stylesheet"/>
For a complete example, seethis codesandbox.
This project is a rewrite of the excellentPostgres Explain Visualizer(pev). Kudos go toAlex Tatiyants.
Thepev project was initialy written in early 2016 but seems to beabandoned since then. There was no activity at all for more than 3 years andcounting though there are several issues open and relevant pull requestspending.
About
Postgres Explain Visualizer 2
Resources
License
Stars
Watchers
Forks
Packages0
Languages
- TypeScript78.3%
- Vue18.6%
- SCSS1.7%
- HTML0.5%
- PLpgSQL0.5%
- CSS0.3%
- Other0.1%