Improvement for templates in create-aleo-app (#831)

* use string template for vanilla js program

* use string template for node-ts app

* use string template for node app

* use string template for nextjs example

* use string template for extension example

* utilize arguments of localProgramExecution

* add arguments for localProgramExecution in nextjs example

* update localProgramExecution example in node template

* update localProgramExecution example in node ts template

* utilize localProgramExecution in vanilla template

---------

Co-authored-by: Brent C <[email protected]>

Author: WillXing

create-aleo-app/template-extension/src/worker.js

@@ -2,14 +2,14 @@ import {Account, initThreadPool, PrivateKey, ProgramManager,} from "@aleohq/sdk"
 
 await initThreadPool();
 
-const hello_hello_program =
-    "program hello_hello.aleo;\n" +
-    "\n" +
-    "function hello:\n" +
-    "    input r0 as u32.public;\n" +
-    "    input r1 as u32.private;\n" +
-    "    add r0 r1 into r2;\n" +
-    "    output r2 as u32.private;\n";
+const hello_hello_program =`
+program hello_hello.aleo;
+
+function hello:
+    input r0 as u32.public;
+    input r1 as u32.private;
+    add r0 r1 into r2;
+    output r2 as u32.private;`
 
 async function localProgramExecution(program, aleoFunction, inputs) {
     const programManager = new ProgramManager();
@@ -19,16 +19,16 @@ async function localProgramExecution(program, aleoFunction, inputs) {
     programManager.setAccount(account);
 
     const executionResponse = await programManager.run(
-        hello_hello_program,
-        "hello",
-        ["5u32", "5u32"],
+        program,
+        aleoFunction,
+        inputs,
         false,
     );
     return executionResponse.getOutputs();
 }
 
 const start = Date.now();
 console.log("Starting execute!");
-const result = await localProgramExecution();
+const result = await localProgramExecution(hello_hello_program, "hello", ["5u32", "5u32"]);
 console.log(result);
 console.log("Execute finished!", Date.now() - start);

create-aleo-app/template-nextjs-ts/src/app/worker.ts

@@ -7,26 +7,26 @@ import {
 
 await initThreadPool();
 
-const hello_hello_program =
-    "program hello_hello.aleo;\n" +
-    "\n" +
-    "function hello:\n" +
-    "    input r0 as u32.public;\n" +
-    "    input r1 as u32.private;\n" +
-    "    add r0 r1 into r2;\n" +
-    "    output r2 as u32.private;\n";
-
-async function localProgramExecution() {
-  const programManager = new ProgramManager(undefined, undefined, undefined);
+const hello_hello_program =`
+program hello_hello.aleo;
+
+function hello:
+    input r0 as u32.public;
+    input r1 as u32.private;
+    add r0 r1 into r2;
+    output r2 as u32.private;`
+
+async function localProgramExecution(program: string, aleoFunction: string, inputs: string[]) {
+  const programManager = new ProgramManager();
 
   // Create a temporary account for the execution of the program
   const account = new Account();
   programManager.setAccount(account);
 
   const executionResponse = await programManager.run(
-      hello_hello_program,
-      "hello",
-      ["5u32", "5u32"],
+      program,
+      aleoFunction,
+      inputs,
       false,
   );
   return executionResponse.getOutputs();
@@ -38,7 +38,7 @@ function getPrivateKey() {
 
 onmessage = async function (e) {
   if (e.data === "execute") {
-    const result = await localProgramExecution();
+    const result = await localProgramExecution(hello_hello_program, "hello", ["5u32", "5u32"]);
     postMessage({type: "execute", result: result});
   } else if (e.data === "key") {
     const result = getPrivateKey();

create-aleo-app/template-node-ts/src/index.ts

@@ -2,17 +2,19 @@ import {Account, initThreadPool, ProgramManager, AleoKeyProvider, AleoKeyProvide
 
 await initThreadPool();
 
-const hello_hello_program =
-    "program hello_hello.aleo;\n" +
-    "\n" +
-    "function hello:\n" +
-    "    input r0 as u32.public;\n" +
-    "    input r1 as u32.private;\n" +
-    "    add r0 r1 into r2;\n" +
-    "    output r2 as u32.private;\n";
+const programName = "hello_hello.aleo"
 
-async function localProgramExecution() {
-    const programManager = new ProgramManager(undefined, undefined, undefined);
+const hello_hello_program =`
+program ${programName};
+
+function hello:
+    input r0 as u32.public;
+    input r1 as u32.private;
+    add r0 r1 into r2;
+    output r2 as u32.private;`
+
+async function localProgramExecution(program, programName, aleoFunction, inputs) {
+    const programManager = new ProgramManager();
 
     // Create a temporary account for the execution of the program
     const account = new Account();
@@ -24,26 +26,26 @@ async function localProgramExecution() {
     programManager.setKeyProvider(keyProvider);
 
     // Pre-synthesize the program keys and then cache them in memory using key provider
-    const keyPair = await programManager.synthesizeKeys(hello_hello_program, "hello", ["1u32", "1u32"]);
+    const keyPair = await programManager.synthesizeKeys(hello_hello_program, aleoFunction, inputs);
 
     if (keyPair instanceof Error) {
         throw new Error(`Failed to synthesize keys: ${keyPair.message}`);
     } else {
-        programManager.keyProvider.cacheKeys("hello_hello.aleo:hello", keyPair);
+        programManager.keyProvider.cacheKeys(`${programName}:${aleoFunction}`, keyPair);
     }
 
-    programManager.keyProvider.cacheKeys("hello_hello.aleo:hello", keyPair);
+    programManager.keyProvider.cacheKeys(`${programName}:${aleoFunction}`, keyPair);
 
     // Specify parameters for the key provider to use search for program keys. In particular specify the cache key
     // that was used to cache the keys in the previous step.
-    const keyProviderParams = new AleoKeyProviderParams({cacheKey: "hello_hello.aleo:hello"});
+    const keyProviderParams = new AleoKeyProviderParams({cacheKey: `${programName}:${aleoFunction}`});
 
     // Execute once using the key provider params defined above. This will use the cached proving keys and make
     // execution significantly faster.
     let executionResponse = await programManager.run(
-        hello_hello_program,
-        "hello",
-        ["5u32", "5u32"],
+        program,
+        aleoFunction,
+        inputs,
         true,
         undefined,
         keyProviderParams,
@@ -60,5 +62,5 @@ async function localProgramExecution() {
 
 const start = Date.now();
 console.log("Starting execute!");
-await localProgramExecution();
+await localProgramExecution(hello_hello_program, programName, "hello", ["5u32", "5u32"]);
 console.log("Execute finished!", Date.now() - start);

create-aleo-app/template-node/index.js

@@ -2,16 +2,18 @@ import {Account, initThreadPool, ProgramManager, AleoKeyProvider, AleoKeyProvide
 
 await initThreadPool();
 
-const hello_hello_program =
-    "program hello_hello.aleo;\n" +
-    "\n" +
-    "function hello:\n" +
-    "    input r0 as u32.public;\n" +
-    "    input r1 as u32.private;\n" +
-    "    add r0 r1 into r2;\n" +
-    "    output r2 as u32.private;\n";
-
-async function localProgramExecution(program, aleoFunction, inputs) {
+const programName = "hello_hello.aleo"
+
+const hello_hello_program =`
+program ${programName};
+
+function hello:
+    input r0 as u32.public;
+    input r1 as u32.private;
+    add r0 r1 into r2;
+    output r2 as u32.private;`
+
+async function localProgramExecution(program, programName, aleoFunction, inputs) {
     const programManager = new ProgramManager();
 
     // Create a temporary account for the execution of the program
@@ -24,19 +26,19 @@ async function localProgramExecution(program, aleoFunction, inputs) {
     programManager.setKeyProvider(keyProvider);
 
     // Pre-synthesize the program keys and then cache them in memory using key provider
-    const keyPair = await programManager.synthesizeKeys(hello_hello_program, "hello", ["1u32", "1u32"]);
-    programManager.keyProvider.cacheKeys("hello_hello.aleo:hello", keyPair);
+    const keyPair = await programManager.synthesizeKeys(hello_hello_program, aleoFunction, inputs);
+    programManager.keyProvider.cacheKeys(`${programName}:${aleoFunction}`, keyPair);
 
     // Specify parameters for the key provider to use search for program keys. In particular specify the cache key
     // that was used to cache the keys in the previous step.
-    const keyProviderParams = new AleoKeyProviderParams({cacheKey: "hello_hello.aleo:hello"});
+    const keyProviderParams = new AleoKeyProviderParams({cacheKey: `${programName}:${aleoFunction}`});
 
     // Execute once using the key provider params defined above. This will use the cached proving keys and make
     // execution significantly faster.
     let executionResponse = await programManager.run(
-        hello_hello_program,
-        "hello",
-        ["5u32", "5u32"],
+        program,
+        aleoFunction,
+        inputs,
         true,
         undefined,
         keyProviderParams,
@@ -53,5 +55,5 @@ async function localProgramExecution(program, aleoFunction, inputs) {
 
 const start = Date.now();
 console.log("Starting execute!");
-await localProgramExecution();
+await localProgramExecution(hello_hello_program, programName, "hello", ["5u32", "5u32"]);
 console.log("Execute finished!", Date.now() - start);

create-aleo-app/template-vanilla/worker.js

@@ -7,14 +7,14 @@ import {
 
 await initThreadPool();
 
-const hello_hello_program =
-    "program hello_hello.aleo;\n" +
-    "\n" +
-    "function hello:\n" +
-    "    input r0 as u32.public;\n" +
-    "    input r1 as u32.private;\n" +
-    "    add r0 r1 into r2;\n" +
-    "    output r2 as u32.private;\n";
+const hello_hello_program =`
+program hello_hello.aleo;
+
+function hello:
+    input r0 as u32.public;
+    input r1 as u32.private;
+    add r0 r1 into r2;
+    output r2 as u32.private;`
 
 async function localProgramExecution(program, aleoFunction, inputs) {
     const programManager = new ProgramManager();
@@ -24,9 +24,9 @@ async function localProgramExecution(program, aleoFunction, inputs) {
     programManager.setAccount(account);
 
     const executionResponse = await programManager.run(
-        hello_hello_program,
-        "hello",
-        ["5u32", "5u32"],
+        program,
+        aleoFunction,
+        inputs,
         false,
     );
     return executionResponse.getOutputs();
@@ -38,7 +38,7 @@ function getPrivateKey() {
 
 onmessage = async function (e) {
     if (e.data === "execute") {
-        const result = await localProgramExecution();
+        const result = await localProgramExecution(hello_hello_program, "hello", ["5u32", "5u32"]);
         postMessage(result);
     } else if (e.data === "key") {
         const result = getPrivateKey();