From 939ac2ca5567d67c8630cdcd7ca544fbe73e6136 Mon Sep 17 00:00:00 2001 From: Cohan Date: Fri, 16 Aug 2024 23:07:51 -0400 Subject: [PATCH] feat: add example for datasheet + verbiage (#2242) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Based on what Paul wrote to me > wrote some verbiage for the datasheet: > The data on this page can be used to estimate the total time and work required for proving zkVM applications. We recommend reading about our [recursive proving architecture](https://dev.risczero.com/api/recursion) as a companion for this page. > Example > To prove 6 million cycles (6 segments), the work required is… > 6 million cycles of `execute` > 6 calls to `rv32im` (1M cycles) > 6 calls to `lift` > 5 calls to `join` > 1 call to `identity_p254`(optional) > 1 call to stark2snark (optional) > The last two steps are only required if you’d like to verify your proofs on-chain. The row labelled `succinct` shows the cost for execute + rv32im + lift. The row labelled `groth16` shows the cost for execute + rv32im + lift + identity_p254 + stark2snark. On Bonsai, calls to rv32im, lift, and join are parallellized. Screenshots: image image --------- Co-authored-by: Frank Laub --- .../[version]/datasheet/layout.tsx | 80 ++++++++++++++++++- web/package.json | 16 ++-- web/packages/shared/styles/styles.css | 6 +- 3 files changed, 92 insertions(+), 10 deletions(-) diff --git a/web/apps/benchmarks-and-reports/src/app/(benchmarks-and-reports)/[version]/datasheet/layout.tsx b/web/apps/benchmarks-and-reports/src/app/(benchmarks-and-reports)/[version]/datasheet/layout.tsx index 69eb142269..57f2f30235 100644 --- a/web/apps/benchmarks-and-reports/src/app/(benchmarks-and-reports)/[version]/datasheet/layout.tsx +++ b/web/apps/benchmarks-and-reports/src/app/(benchmarks-and-reports)/[version]/datasheet/layout.tsx @@ -1,4 +1,10 @@ +import { Badge } from "@risc0/ui/badge"; +import { Button } from "@risc0/ui/button"; +import { Popover, PopoverContent, PopoverTrigger } from "@risc0/ui/popover"; import { Separator } from "@risc0/ui/separator"; +import { Tooltip, TooltipContent, TooltipTrigger } from "@risc0/ui/tooltip"; +import { InfoIcon } from "lucide-react"; +import Link from "next/link"; import { type PropsWithChildren, Suspense } from "react"; import { SuspenseLoader } from "shared/client/components/suspense-loader"; import type { Version } from "~/types/version"; @@ -6,6 +12,17 @@ import { FooterAscii } from "../../_components/footer-ascii"; import { redirectIfWrongVersion } from "../../_utils/redirect-if-wrong-version"; import { DatasheetCommitHashButton } from "./_components/datasheet-commit-hash-button"; +function CodeBadge({ children }: PropsWithChildren) { + return ( + + {children} + + ); +} + export default function DatasheetLayout({ children, params, @@ -19,7 +36,68 @@ export default function DatasheetLayout({ return (
-

Datasheet

+
+

Datasheet

+

+ The data on this page can be used to estimate the total time and work required for proving zkVM + applications. We recommend reading about our{" "} + + recursive proving architecture + {" "} + as a companion for this page. +

+
+ + + + + +

To prove 6 million cycles (6 segments), the work required is:

+
+
    +
  • + * 6 million cycles of execute +
    • +
  • + * 6 calls to rv32im (1M cycles) +
    • +
  • + * 6 calls to lift +
    • +
  • + * 5 calls to join +
    • +
  • + * 1 call to identity_p254 (optional) +
    • +
  • + * 1 call to stark2snark (optional) +
    • +
+
+

+ The last two steps are only required if you'd like to verify your proofs on-chain. The row labelled{" "} + succinct shows the cost for execute +{" "} + rv32im + lift. The row labelled{" "} + groth16 shows the cost for execute +{" "} + rv32im + lift + identity_p254 + + stark2snark. +
+
+ On Bonsai, calls to rv32im, lift, and{" "} + join are parallellized. +

+ + +
+
}> diff --git a/web/package.json b/web/package.json index 3c44bfa7bc..683af6f17d 100644 --- a/web/package.json +++ b/web/package.json @@ -11,17 +11,17 @@ }, "dependencies": { "@joshdavenport/tailwindcss-filter-order": "0.2.0", - "@poppinss/intl-formatter": "3.0.2", + "@poppinss/intl-formatter": "3.0.3", "@risc0/ui": "0.0.89", "@t3-oss/env-nextjs": "0.11.0", - "@tanstack/match-sorter-utils": "8.15.1", - "@tanstack/react-table": "8.19.3", + "@tanstack/match-sorter-utils": "8.19.4", + "@tanstack/react-table": "8.20.1", "@vercel/analytics": "1.3.1", "@vercel/speed-insights": "1.0.12", "chart.js": "2.9.4", "deepmerge": "4.3.1", - "framer-motion": "11.3.19", - "lucide-react": "0.417.0", + "framer-motion": "11.3.28", + "lucide-react": "0.428.0", "next": "14.2.5", "next-themes": "0.3.0", "prism-react-renderer": "2.3.1", @@ -31,7 +31,7 @@ "react-dom": "18.3.1", "react-rainbow-ascii": "1.0.3", "sharp": "0.33.4", - "turbo": "2.0.10", + "turbo": "2.0.14", "typescript": "5.5.4", "zod": "3.23.8" }, @@ -40,9 +40,9 @@ "@next/bundle-analyzer": "14.2.5", "@types/chart.js": "2.9.41", "@types/jest": "29.5.12", - "@types/node": "22.0.0", + "@types/node": "22.3.0", "@types/react": "18.3.3", "@types/react-dom": "18.3.0" }, - "packageManager": "bun@1.1.15" + "packageManager": "bun@1.1.24" } diff --git a/web/packages/shared/styles/styles.css b/web/packages/shared/styles/styles.css index d25b6e1aa0..351d832788 100644 --- a/web/packages/shared/styles/styles.css +++ b/web/packages/shared/styles/styles.css @@ -51,7 +51,11 @@ html { } a { - @apply focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring + @apply focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring; +} + +.link { + @apply hover:text-primary dark:no-underline underline; } /* Chartjs */