Skip to content

Commit b9ba633

Browse files
authored
Merge pull request #3623 from ClickHouse/code_widget
Code widget
2 parents 09029ba + b38ad61 commit b9ba633

30 files changed

+3684
-98
lines changed

Diff for: docs/cloud/manage/dashboards.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
sidebar_label: 'Dashboards'
33
slug: /cloud/manage/dashboards
44
title: 'Dashboards'
5-
description: 'The SQL Console's dashboards feature allows you to collect and share visualizations from saved queries.'
5+
description: 'The SQL Console dashboards feature allows you to collect and share visualizations from saved queries.'
66
---
77

88
import BetaBadge from '@theme/badges/BetaBadge';

Diff for: docs/managing-data/core-concepts/partitions.md

+15-58
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,6 @@ Partitioning can be enabled when a table is initially defined via the [PARTITION
2424

2525
To illustrate this, we [enhance](https://sql.clickhouse.com/?query=U0hPVyBDUkVBVEUgVEFCTEUgdWsudWtfcHJpY2VfcGFpZF9zaW1wbGVfcGFydGl0aW9uZWQ&run_query=true&tab=results) the [What are table parts](/parts) example table by adding a `PARTITION BY toStartOfMonth(date)` clause, which organizes the table`s data parts based on the months of property sales:
2626

27-
2827
```sql
2928
CREATE TABLE uk.uk_price_paid_simple_partitioned
3029
(
@@ -67,26 +66,15 @@ As sketched in the diagram above, parts belonging to different partitions are ne
6766

6867
You can [query](https://sql.clickhouse.com/?query=U0VMRUNUIERJU1RJTkNUIF9wYXJ0aXRpb25fdmFsdWUgQVMgcGFydGl0aW9uCkZST00gdWsudWtfcHJpY2VfcGFpZF9zaW1wbGVfcGFydGl0aW9uZWQKT1JERVIgQlkgcGFydGl0aW9uIEFTQw&run_query=true&tab=results) the list of all existing unique partitions of our example table by using the [virtual column](/engines/table-engines#table_engines-virtual_columns) `_partition_value`:
6968

70-
```sql
69+
```sql runnable
7170
SELECT DISTINCT _partition_value AS partition
7271
FROM uk.uk_price_paid_simple_partitioned
7372
ORDER BY partition ASC;
74-
75-
76-
┌─partition──────┐
77-
1. │ ('1995-01-01') │
78-
2. │ ('1995-02-01') │
79-
3. │ ('1995-03-01') │
80-
...
81-
304. │ ('2021-04-01') │
82-
305. │ ('2021-05-01') │
83-
306. │ ('2021-06-01') │
84-
└────────────────┘
8573
```
8674

8775
Alternatively, ClickHouse tracks all parts and partitions of all tables in the [system.parts](/operations/system-tables/parts) system table, and the following query [returns](https://sql.clickhouse.com/?query=U0VMRUNUCiAgICBwYXJ0aXRpb24sCiAgICBjb3VudCgpIEFTIHBhcnRzLAogICAgc3VtKHJvd3MpIEFTIHJvd3MKRlJPTSBzeXN0ZW0ucGFydHMKV0hFUkUgKGRhdGFiYXNlID0gJ3VrJykgQU5EIChgdGFibGVgID0gJ3VrX3ByaWNlX3BhaWRfc2ltcGxlX3BhcnRpdGlvbmVkJykgQU5EIGFjdGl2ZQpHUk9VUCBCWSBwYXJ0aXRpb24KT1JERVIgQlkgcGFydGl0aW9uIEFTQzs&run_query=true&tab=results) for our example table above the list of all partitions, plus the current number of active parts and the sum of rows in these parts per partition:
8876

89-
```sql
77+
```sql runnable
9078
SELECT
9179
partition,
9280
count() AS parts,
@@ -95,17 +83,6 @@ FROM system.parts
9583
WHERE (database = 'uk') AND (`table` = 'uk_price_paid_simple_partitioned') AND active
9684
GROUP BY partition
9785
ORDER BY partition ASC;
98-
99-
100-
┌─partition──┬─parts─┬───rows─┐
101-
1. │ 1995-01-01150473
102-
2. │ 1995-02-01150840
103-
3. │ 1995-03-01171276
104-
...
105-
304. │ 2021-04-01323160
106-
305. │ 2021-05-01317607
107-
306. │ 2021-06-0135652
108-
└─partition──┴─parts─┴───rows─┘
10986
```
11087

11188

@@ -152,20 +129,12 @@ TTL date + INTERVAL 12 MONTH TO VOLUME 'slow_but_cheap';
152129

153130
Partitions can assist with query performance, but this depends heavily on the access patterns. If queries target only a few partitions (ideally one), performance can potentially improve. This is only typically useful if the partitioning key is not in the primary key and you are filtering by it, as shown in the example query below.
154131

155-
```sql
132+
```sql runnable
156133
SELECT MAX(price) AS highest_price
157-
FROM uk_price_paid_simple_partitioned
134+
FROM uk.uk_price_paid_simple_partitioned
158135
WHERE date >= '2020-12-01'
159136
AND date <= '2020-12-31'
160137
AND town = 'LONDON';
161-
162-
163-
┌─highest_price─┐
164-
1. │ 296280000-- 296.28 million
165-
└───────────────┘
166-
167-
1 row in set. Elapsed: 0.006 sec. Processed 8.19 thousand rows, 57.34 KB (1.36 million rows/s., 9.49 MB/s.)
168-
Peak memory usage: 2.73 MiB.
169138
```
170139

171140
The query runs over our example table from above and [calculates](https://sql.clickhouse.com/?query=U0VMRUNUIE1BWChwcmljZSkgQVMgaGlnaGVzdF9wcmljZQpGUk9NIHVrLnVrX3ByaWNlX3BhaWRfc2ltcGxlX3BhcnRpdGlvbmVkCldIRVJFIGRhdGUgPj0gJzIwMjAtMTItMDEnCiAgQU5EIGRhdGUgPD0gJzIwMjAtMTItMzEnCiAgQU5EIHRvd24gPSAnTE9ORE9OJzs&run_query=true&tab=results) the highest price of all sold properties in London in December 2020 by filtering on both a column (`date`) used in the table's partition key and on a column (`town`) used in the table's primary key (and `date` is not part of the primary key).
@@ -182,10 +151,10 @@ ClickHouse processes that query by applying a sequence of pruning techniques to
182151

183152
We can observe these data pruning steps by [inspecting](https://sql.clickhouse.com/?query=RVhQTEFJTiBpbmRleGVzID0gMQpTRUxFQ1QgTUFYKHByaWNlKSBBUyBoaWdoZXN0X3ByaWNlCkZST00gdWsudWtfcHJpY2VfcGFpZF9zaW1wbGVfcGFydGl0aW9uZWQKV0hFUkUgZGF0ZSA-PSAnMjAyMC0xMi0wMScKICBBTkQgZGF0ZSA8PSAnMjAyMC0xMi0zMScKICBBTkQgdG93biA9ICdMT05ET04nOw&run_query=true&tab=results) the physical query execution plan for our example query from above via an [EXPLAIN](/sql-reference/statements/explain) clause :
184153

185-
```sql
154+
```sql style="fontSize:13px"
186155
EXPLAIN indexes = 1
187156
SELECT MAX(price) AS highest_price
188-
FROM uk_price_paid_simple_partitioned
157+
FROM uk.uk_price_paid_simple_partitioned
189158
WHERE date >= '2020-12-01'
190159
AND date <= '2020-12-31'
191160
AND town = 'LONDON';
@@ -240,37 +209,27 @@ With partitioning, the data is usually distributed across more data parts, which
240209

241210
We can demonstrate this by running the same query over both the [What are table parts](/parts) example table (without partitioning enabled), and our current example table from above (with partitioning enabled). Both tables [contain](https://sql.clickhouse.com/?query=U0VMRUNUCiAgICB0YWJsZSwKICAgIHN1bShyb3dzKSBBUyByb3dzCkZST00gc3lzdGVtLnBhcnRzCldIRVJFIChkYXRhYmFzZSA9ICd1aycpIEFORCAoYHRhYmxlYCBJTiBbJ3VrX3ByaWNlX3BhaWRfc2ltcGxlJywgJ3VrX3ByaWNlX3BhaWRfc2ltcGxlX3BhcnRpdGlvbmVkJ10pIEFORCBhY3RpdmUKR1JPVVAgQlkgdGFibGU7&run_query=true&tab=results) the same data and number of rows:
242211

243-
```sql
212+
```sql runnable
244213
SELECT
245214
table,
246215
sum(rows) AS rows
247216
FROM system.parts
248217
WHERE (database = 'uk') AND (table IN ['uk_price_paid_simple', 'uk_price_paid_simple_partitioned']) AND active
249218
GROUP BY table;
250-
251-
┌─table────────────────────────────┬─────rows─┐
252-
1. │ uk_price_paid_simple │ 25248433
253-
2. │ uk_price_paid_simple_partitioned │ 25248433
254-
└──────────────────────────────────┴──────────┘
255219
```
256220

257221
However, the table with partitions enabled, [has](https://sql.clickhouse.com/?query=U0VMRUNUCiAgICB0YWJsZSwKICAgIGNvdW50KCkgQVMgcGFydHMKRlJPTSBzeXN0ZW0ucGFydHMKV0hFUkUgKGRhdGFiYXNlID0gJ3VrJykgQU5EIChgdGFibGVgIElOIFsndWtfcHJpY2VfcGFpZF9zaW1wbGUnLCAndWtfcHJpY2VfcGFpZF9zaW1wbGVfcGFydGl0aW9uZWQnXSkgQU5EIGFjdGl2ZQpHUk9VUCBCWSB0YWJsZTs&run_query=true&tab=results) more active [data parts](/parts), because, as mentioned above, ClickHouse only [merges](/parts) data parts within, but not across partitions:
258222

259-
```sql
223+
```sql runnable
260224
SELECT
261225
table,
262226
count() AS parts
263227
FROM system.parts
264228
WHERE (database = 'uk') AND (table IN ['uk_price_paid_simple', 'uk_price_paid_simple_partitioned']) AND active
265229
GROUP BY table;
266230

267-
268-
┌─table────────────────────────────┬─parts─┐
269-
1. │ uk_price_paid_simple │ 1
270-
2. │ uk_price_paid_simple_partitioned │ 436
271-
└──────────────────────────────────┴───────┘
272231
```
273-
As shown further above, the partitioned table `uk_price_paid_simple_partitioned` has 306 partitions, and therefore at least 306 active data parts. Whereas for our non-partitioned table `uk_price_paid_simple` all [initial](/parts) data parts could be merged into a single active part by background merges.
232+
As shown further above, the partitioned table `uk_price_paid_simple_partitioned` has over 600 partitions, and therefore at 600 306 active data parts. Whereas for our non-partitioned table `uk_price_paid_simple` all [initial](/parts) data parts could be merged into a single active part by background merges.
274233

275234

276235
When we [check](https://sql.clickhouse.com/?query=RVhQTEFJTiBpbmRleGVzID0gMQpTRUxFQ1QgTUFYKHByaWNlKSBBUyBoaWdoZXN0X3ByaWNlCkZST00gdWsudWtfcHJpY2VfcGFpZF9zaW1wbGVfcGFydGl0aW9uZWQKV0hFUkUgdG93biA9ICdMT05ET04nOw&run_query=true&tab=results) the physical query execution plan with an [EXPLAIN](/sql-reference/statements/explain) clause for our example query from above without the partition filter running over the partitioned table, we can see in row 19 and 20 of the output below that ClickHouse identified 671 out of 3257 existing [granules](/guides/best-practices/sparse-primary-indexes#data-is-organized-into-granules-for-parallel-data-processing) (blocks of rows) spread over 431 out of 436 existing active data parts that potentially contain rows matching the query's filter, and therefore will be scanned and processed by the query engine:
@@ -338,10 +297,9 @@ SELECT MAX(price) AS highest_price
338297
FROM uk.uk_price_paid_simple_partitioned
339298
WHERE town = 'LONDON';
340299

341-
342-
┌─highest_price─┐
343-
1. │ 594300000-- 594.30 million
344-
└───────────────┘
300+
┌─highest_price─┐
301+
594300000-- 594.30 million
302+
└───────────────┘
345303

346304
1 row in set. Elapsed: 0.090 sec. Processed 5.48 million rows, 27.95 MB (60.66 million rows/s., 309.51 MB/s.)
347305
Peak memory usage: 163.44 MiB.
@@ -355,10 +313,9 @@ SELECT MAX(price) AS highest_price
355313
FROM uk.uk_price_paid_simple
356314
WHERE town = 'LONDON';
357315

358-
359-
┌─highest_price─┐
360-
1. │ 594300000-- 594.30 million
361-
└───────────────┘
316+
┌─highest_price─┐
317+
594300000-- 594.30 million
318+
└───────────────┘
362319

363320
1 row in set. Elapsed: 0.012 sec. Processed 1.97 million rows, 9.87 MB (162.23 million rows/s., 811.17 MB/s.)
364321
Peak memory usage: 62.02 MiB.

Diff for: docs/quick-start.mdx

+1-1
Original file line numberDiff line numberDiff line change
@@ -138,7 +138,7 @@ ORDER BY timestamp
138138
```
139139
Notice the response comes back in a nice table format:
140140

141-
```response
141+
```text
142142
┌─user_id─┬─message────────────────────────────────────────────┬───────────timestamp─┬──metric─┐
143143
│ 102 │ Insert a lot of rows per batch │ 2022-03-21 00:00:00 │ 1.41421 │
144144
│ 102 │ Sort your data based on your commonly-used queries │ 2022-03-22 00:00:00 │ 2.718 │

Diff for: docusaurus.config.en.js

+3-2
Original file line numberDiff line numberDiff line change
@@ -292,7 +292,7 @@ const config = {
292292
prism: {
293293
theme: themes.darkTheme,
294294
darkTheme: themes.darkTheme,
295-
additionalLanguages: ["java", "cpp", "rust"],
295+
additionalLanguages: ["java", "cpp", "rust", "python", "javascript"],
296296
magicComments: [
297297
// Remember to extend the default highlight class name as well!
298298
{
@@ -360,7 +360,8 @@ const config = {
360360
[
361361
pluginLlmsTxt,
362362
{}
363-
]
363+
],
364+
['./plugins/tailwind-config.js', {}],
364365
],
365366
customFields: {
366367
blogSidebarLink: "/docs/knowledgebase", // Used for KB article page

Diff for: docusaurus.config.jp.js

+2-1
Original file line numberDiff line numberDiff line change
@@ -259,7 +259,7 @@ const config = {
259259
prism: {
260260
theme: themes.darkTheme,
261261
darkTheme: themes.darkTheme,
262-
additionalLanguages: ["java", "cpp", "rust"],
262+
additionalLanguages: ["java", "cpp", "rust", "python", "javascript"],
263263
magicComments: [
264264
// Remember to extend the default highlight class name as well!
265265
{
@@ -297,6 +297,7 @@ const config = {
297297
},
298298
],
299299
chHeader,
300+
['./plugins/tailwind-config.js', {}],
300301
],
301302
customFields: {
302303
blogSidebarLink: "/docs/knowledgebase", // Used for KB article page

Diff for: docusaurus.config.ru.js

+2-1
Original file line numberDiff line numberDiff line change
@@ -265,7 +265,7 @@ const config = {
265265
prism: {
266266
theme: themes.darkTheme,
267267
darkTheme: themes.darkTheme,
268-
additionalLanguages: ["java", "cpp", "rust"],
268+
additionalLanguages: ["java", "cpp", "rust", "python", "javascript"],
269269
magicComments: [
270270
// Remember to extend the default highlight class name as well!
271271
{
@@ -309,6 +309,7 @@ const config = {
309309
},
310310
],
311311
chHeader,
312+
['./plugins/tailwind-config.js', {}],
312313
],
313314
customFields: {
314315
blogSidebarLink: "/docs/knowledgebase", // Used for KB article page

Diff for: docusaurus.config.zh.js

+2-1
Original file line numberDiff line numberDiff line change
@@ -259,7 +259,7 @@ const config = {
259259
prism: {
260260
theme: themes.darkTheme,
261261
darkTheme: themes.darkTheme,
262-
additionalLanguages: ["java", "cpp", "rust"],
262+
additionalLanguages: ["java", "cpp", "rust", "python", "javascript"],
263263
magicComments: [
264264
// Remember to extend the default highlight class name as well!
265265
{
@@ -297,6 +297,7 @@ const config = {
297297
},
298298
],
299299
chHeader,
300+
['./plugins/tailwind-config.js', {}],
300301
],
301302
customFields: {
302303
blogSidebarLink: "/docs/knowledgebase", // Used for KB article page

Diff for: package.json

+12-1
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,8 @@
2727
"run-markdown-linter": "yarn markdownlint-cli2 --config ./scripts/.markdownlint-cli2.yaml 'docs/**/*.md'"
2828
},
2929
"dependencies": {
30+
"@clickhouse/click-ui": "^0.0.199",
31+
"@clickhouse/client-web": "^1.11.0",
3032
"@docusaurus/core": "3.7.0",
3133
"@docusaurus/faster": "^3.7.0",
3234
"@docusaurus/plugin-client-redirects": "^3.7.0",
@@ -41,15 +43,19 @@
4143
"axios": "^1.8.2",
4244
"clsx": "^2.1.0",
4345
"docusaurus-plugin-sass": "^0.2.6",
46+
"echarts": "^5.6.0",
47+
"echarts-for-react": "^3.0.2",
4448
"esbuild": "^0.25.0",
4549
"esbuild-loader": "^4.0.3",
50+
"filesize": "^10.1.6",
4651
"flexsearch": "^0.7.43",
4752
"gray-matter": "^4.0.3",
4853
"hast-util-is-element": "1.1.0",
4954
"http-proxy-middleware": "3.0.3",
5055
"katex": "^0.16.21",
5156
"markdownlint-cli2": "^0.17.2",
5257
"node-fetch": "^3.3.2",
58+
"numeral": "^2.0.6",
5359
"prism-react-renderer": "^2.4.1",
5460
"react": "^18.2.0",
5561
"react-dom": "^18.2.0",
@@ -59,18 +65,23 @@
5965
"remark-link-rewrite": "^1.0.7",
6066
"remark-math": "^6.0.0",
6167
"sass": "^1.86.1",
62-
"search-insights": "^2.17.3"
68+
"search-insights": "^2.17.3",
69+
"short-uuid": "^5.2.0"
6370
},
6471
"devDependencies": {
6572
"@argos-ci/cli": "^2.5.5",
6673
"@argos-ci/playwright": "^3.9.4",
6774
"@docusaurus/module-type-aliases": "3.7.0",
6875
"@playwright/test": "^1.51.1",
76+
"@tailwindcss/postcss": "^4.1.3",
77+
"@tailwindcss/typography": "^0.5.16",
6978
"@types/react": "^19.0.4",
7079
"@types/styled-jsx": "^3.4.4",
7180
"cheerio": "^1.0.0",
7281
"markdownlint-rule-helpers": "^0.28.0",
82+
"postcss": "^8.5.3",
7383
"rsync": "^0.6.1",
84+
"tailwindcss": "^4.1.3",
7485
"typescript": "^5.8.2"
7586
},
7687
"browserslist": {

Diff for: plugins/tailwind-config.js

+9
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
module.exports = function tailwindPlugin(context, options) {
2+
return {
3+
name: 'tailwind-plugin',
4+
configurePostCss(postcssOptions) {
5+
postcssOptions.plugins = [require('@tailwindcss/postcss')]
6+
return postcssOptions
7+
}
8+
}
9+
}

Diff for: postcss.config.js

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
module.exports = {
2+
plugins: {
3+
'@tailwindcss/postcss': {},
4+
}
5+
}

0 commit comments

Comments
 (0)