尧图网站建设 
PostgreSQL Playground 查询历史功能详解执行时间、影响行数与一键复制完全解读【免费下载链接】pgIn Browser PostgreSQL Playground, no server, just client and pglite (postgresql wasm)项目地址: https://gitcode.com/gh_mirrors/pg2/pgPostgreSQL Playground 是一个完全在浏览器中运行的 PostgreSQL 查询练习场它基于 PGLitePostgreSQL 的 WASM 版本无需服务器、无需注册账号数据全部保存在本地。它的查询历史功能会自动记录你执行的每一条 SQL并以时间线形式直观展示执行时间、影响行数还支持一键复制语句是新手学习 PostgreSQL 时非常好用的执行体检报告。查询历史是什么每次执行 SQL 都自动记录在 src/app.tsx 中可以看到左侧导航栏有一个Query History查询历史标签页。只要你在 Playground 中点击Run执行过 SQL再切到该页面就能看到所有执行记录而且时间线布局每条记录按顺序用虚线连接最新的排在最上面一目了然状态指示每条记录左侧有一个圆点绿色代表执行成功红色代表执行报错扫一眼就能知道哪条 SQL 出了错️按库隔离历史记录属于当前连接的数据库切换数据库后看到的是各自的执行记录本地持久化关闭浏览器再打开历史依然还在执行时间右上角的毫秒级徽章每条历史卡片右上角都有一个徽章显示类似2 ms的数字这就是该条 SQL 的执行时间。它的原理很直接在 src/stores.ts 的execute方法中执行 SQL 前用performance.now()记下起始时间执行完成后再取一次时间戳两者相减得到耗时单位毫秒随历史记录一起保存下来。这意味着你可以对比同一张表不同写法查询的耗时差异直观感受索引与 SQL 写法的差别发现看起来简单但其实很慢的语句为后续优化提供依据影响行数与总记录数读懂每条 SQL 的结果每条历史卡片的下半部分会列出该语句的所有结果集一条 SQL 可能包含多个语句每个结果集显示两个数字字段含义适用场景affected rows影响行数该语句实际变更/返回的行数INSERT、UPDATE、DELETE验证是否改到了预期数据total records总记录数查询返回的记录总数SELECT确认查出了多少行相关数据结构定义在 src/stores.ts 的QueryResult与QueryHistory接口中展示逻辑位于 src/components/interfaces/query-history.tsx。如果语句执行失败红色区域会直接显示数据库返回的错误信息无需再切回编辑器排查——这正是红色时间线圆点的价值所在。一键复制把历史 SQL 秒回剪贴板每条历史卡片的 SQL 语句区域右上角有一个复制图标按钮点击后 SQL 全文即进入剪贴板并弹出 copied to clipboard 提示逻辑见 src/components/interfaces/query-history.tsx。背后的实现在 src/components/hooks/use-copy.tsx优先调用现代浏览器的navigator.clipboard.writeTextAPI若不支持则自动降级为创建临时输入框 execCommand(copy)的老方案因此无论新旧浏览器复制功能都能稳定工作。当你需要把某条历史语句改一改再执行或者粘贴给同事排查问题时这一步能省掉手动选中、复制的麻烦。隐私友好所有数据都在你的浏览器里整个应用没有任何后端服务历史记录的持久化通过 zustand 的 persist 中间件写入浏览器的 IndexedDB见 src/utils/idb.ts数据库本身也由 PGLite 以 WASM 方式运行并存储在本地。换句话说你的 SQL 和数据从不出浏览器在公共电脑上学习 PostgreSQL 也没有数据泄露的顾虑。功能文件速查功能文件位置历史时间线 UI、执行时间徽章、复制按钮src/components/interfaces/query-history.tsx执行计时、记录写入历史src/stores.ts剪贴板复制 Hook含降级方案src/components/hooks/use-copy.tsxIndexedDB 本地存储封装src/utils/idb.ts历史标签页入口src/app.tsx 小贴士执行时间、影响行数 一键复制的组合让查询历史天然成为一个轻量级SQL 复盘工具——先跑通、再看耗时、有问题改完再跑循环往复非常适合新手建立 SQL 性能直觉。【免费下载链接】pgIn Browser PostgreSQL Playground, no server, just client and pglite (postgresql wasm)项目地址: https://gitcode.com/gh_mirrors/pg2/pg创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考 PostgreSQL Playground 查询历史功能详解：执行时间、影响行数与一键复制完全解读
PostgreSQL Playground 查询历史功能详解执行时间、影响行数与一键复制完全解读【免费下载链接】pgIn Browser PostgreSQL Playground, no server, just client and pglite (postgresql wasm)项目地址: https://gitcode.com/gh_mirrors/pg2/pgPostgreSQL Playground 是一个完全在浏览器中运行的 PostgreSQL 查询练习场它基于 PGLitePostgreSQL 的 WASM 版本无需服务器、无需注册账号数据全部保存在本地。它的查询历史功能会自动记录你执行的每一条 SQL并以时间线形式直观展示执行时间、影响行数还支持一键复制语句是新手学习 PostgreSQL 时非常好用的执行体检报告。查询历史是什么每次执行 SQL 都自动记录在 src/app.tsx 中可以看到左侧导航栏有一个Query History查询历史标签页。只要你在 Playground 中点击Run执行过 SQL再切到该页面就能看到所有执行记录而且时间线布局每条记录按顺序用虚线连接最新的排在最上面一目了然状态指示每条记录左侧有一个圆点绿色代表执行成功红色代表执行报错扫一眼就能知道哪条 SQL 出了错️按库隔离历史记录属于当前连接的数据库切换数据库后看到的是各自的执行记录本地持久化关闭浏览器再打开历史依然还在执行时间右上角的毫秒级徽章每条历史卡片右上角都有一个徽章显示类似2 ms的数字这就是该条 SQL 的执行时间。它的原理很直接在 src/stores.ts 的execute方法中执行 SQL 前用performance.now()记下起始时间执行完成后再取一次时间戳两者相减得到耗时单位毫秒随历史记录一起保存下来。这意味着你可以对比同一张表不同写法查询的耗时差异直观感受索引与 SQL 写法的差别发现看起来简单但其实很慢的语句为后续优化提供依据影响行数与总记录数读懂每条 SQL 的结果每条历史卡片的下半部分会列出该语句的所有结果集一条 SQL 可能包含多个语句每个结果集显示两个数字字段含义适用场景affected rows影响行数该语句实际变更/返回的行数INSERT、UPDATE、DELETE验证是否改到了预期数据total records总记录数查询返回的记录总数SELECT确认查出了多少行相关数据结构定义在 src/stores.ts 的QueryResult与QueryHistory接口中展示逻辑位于 src/components/interfaces/query-history.tsx。如果语句执行失败红色区域会直接显示数据库返回的错误信息无需再切回编辑器排查——这正是红色时间线圆点的价值所在。一键复制把历史 SQL 秒回剪贴板每条历史卡片的 SQL 语句区域右上角有一个复制图标按钮点击后 SQL 全文即进入剪贴板并弹出 copied to clipboard 提示逻辑见 src/components/interfaces/query-history.tsx。背后的实现在 src/components/hooks/use-copy.tsx优先调用现代浏览器的navigator.clipboard.writeTextAPI若不支持则自动降级为创建临时输入框 execCommand(copy)的老方案因此无论新旧浏览器复制功能都能稳定工作。当你需要把某条历史语句改一改再执行或者粘贴给同事排查问题时这一步能省掉手动选中、复制的麻烦。隐私友好所有数据都在你的浏览器里整个应用没有任何后端服务历史记录的持久化通过 zustand 的 persist 中间件写入浏览器的 IndexedDB见 src/utils/idb.ts数据库本身也由 PGLite 以 WASM 方式运行并存储在本地。换句话说你的 SQL 和数据从不出浏览器在公共电脑上学习 PostgreSQL 也没有数据泄露的顾虑。功能文件速查功能文件位置历史时间线 UI、执行时间徽章、复制按钮src/components/interfaces/query-history.tsx执行计时、记录写入历史src/stores.ts剪贴板复制 Hook含降级方案src/components/hooks/use-copy.tsxIndexedDB 本地存储封装src/utils/idb.ts历史标签页入口src/app.tsx 小贴士执行时间、影响行数 一键复制的组合让查询历史天然成为一个轻量级SQL 复盘工具——先跑通、再看耗时、有问题改完再跑循环往复非常适合新手建立 SQL 性能直觉。【免费下载链接】pgIn Browser PostgreSQL Playground, no server, just client and pglite (postgresql wasm)项目地址: https://gitcode.com/gh_mirrors/pg2/pg创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考