That title is perhaps somewhat overselling the story. At least it does not have anything like “Top 5” or “The result will surprise you” or “Shocking Outcome”. It is a very simple solution to a fairly straightforward problem.
The solution: a web application that allows the user to upload ( or paste) a data file ( text string, csv or json) as well as paste and execute a JavaScript code block to process that data. This allows any user to use the script generated by Le Chat, Gemini or ChatGPT on their own data — and use it locally, safely, quickly, cheaply and repeatedly.
The problem this addresses: when working with data sets, you may want to invoke the help of an LLM backed ChatBot to do some of the manipulation, enriching, filtering etc for you. However, there are some reasons why that is not viable:
* the data is confidential and the Chatbot is a public service
* the Chatbot is not capabable of understanding or executing your request
* the Chatbot is too slow or too expensive
* you will have to perform the same operation many times and having an LLM chew on it every time is slow and not really responsible use of AI
There a fairly simple approach that deals with all of these challenges: with a indirect prompt ask the Chatbot not to manipulate your data directly but to generate a piece of JavaScript to do so. You will have to tell the Chatbot [once] what your data looks like (not even your real data, just something similar and only a small portion of it) and describe what you want to have done to it and what the result should look like. Using a well structured prompt like the one shown below it is not hard at all to get ChatGPT, Gemini, Copilot or Le Chat to generate a piece of JavaScript.
However, until now the challenge was for many users like my mom and my not so IT savvy son: how can I use that piece of code? And how can I have it work against my data?
Now this is precisely what this simple little app is for. In it, you bring together the code (courtesy of the LLM) and your data (paste it or upload it) — and you then run the code against the data. The output is visible in the browser page, can be copied to the clipboard and can be downloaded. Note that this all happens inside the user’s local browser. The app is downloaded (then cached) and from that point on, nothing leaves the browser except when the user wills it so by downloading or copy/pasting the results. One simple URL and all non-techie users can leverage the coding capabilities of LLMs just like their more code-aware colleagues and family members. Of course for that latter category, having a simple way to run LLM produced code on personal data can be handy too.
Once it has been proven to work well, the same code can be executed in the same way many times — against different sets of data — without revisiting the LLM/Chatbot. The user can save the code with a description to the local library for easy future reuse.
When it first opens, the app comes with a sample library. The samples show for several use cases the prompt, the LLM generated code based on that prompt, the input data and the output. These samples illustrate how you could work with the prompt and the chatbot to craft code that processes your data in the desired way — without the user having to write or even understand JavaScript.
Simple Example
The input data is a very long list (of numbers, names, dates). We need this list to be de-duplicated. The elements in the list or not be shared outside our company. We may want to perform this uniquization many times. Whatever the reason: we will get an LLM to create a JavaScript code snippet and then run that code locally on the real data.
Open the JavaScript Executor web app. https://lucasjellema.github.io/javascript-code-executor/
Click on “Prompt”. Open your favorite Chat service — Le Chat, Gemini, ChatGPT, DeepSeek. Paste the prompt from the clipboard and edit the last bit:
“I have a list of strings. Each string is on a separate line. I want each string to occur only once in the list. Take out all duplicates. And please also sort in alphabetical order.”
Example data:
Portico
Wells
Piano
Wells
Roam
PianoExample Output:
Piano
Portico
Roam
Wells
Feed this input to the LLM.
Grab the output it generates. This should be JavaScript in a form that can easily be pasted into the JavaScript Executor app.
Like this
const lines = data.trim().split('\n');
return Array.from(new Set(lines)).sort();
Code simple to write — when you are a coder. A magic formula when you are not.
Now simply paste it to the JavaScript field (2). Also paste or upload the data set to the Data field (1). And press Run (3).
The code is executed against the data and the result is presented in the Result field from where it can be pasted or downloaded.
The result can be copied to clipboard and downloaded.
A very simple example of how anyone can use the power of LLM code generation in a simple, local, safe, fast environment.
Slightly more interesting example
In this second example — included in the Samples library in the app — the user wants to Sort CSV data — and be able to so by any field (by adding an asterisk to the field name that should be the one to sort by).
The prompt fed into the LLM
You are a code assistant.
I will provide you with:
– The input data (as a string, which may be CSV, JSON, or plain text).
– The transformation or processing I want done.
Write a single JavaScript function body that:
– Accepts one argument called `data` (string).
– Processes it according to my request.
– Returns the result (object, array, or string).
Important:
– Do not include explanations or comments.
– Do not include markdown formatting or triple backticks.
– The output must be **only valid JavaScript code** for the function body.
Example input:
Data: JSON array of objects
Task: return the names in uppercase
Desired Example Output:
const obj = JSON.parse(data);
return obj.map(x => x.name.toUpperCase());
Now here is my request:
Data:
name,city,#employees,revenue,industry*,year of founding
Acme Corporation,New York,1500,500M,Technology,1998
Globex Inc.,San Francisco,800,250M,Finance,2005
Cyberdyne Systems,Los Angeles,2200,1.2B,Manufacturing,1985
Task:
Find the field with an asterisk at the end and sort the data by that field. If the field contains numerical values, then sort from minimum to maximum, otherwise sort alphabetically. Return the data in the same CSV format. Move the sort field to the front.
Take the generated code and paste into the web app. Upload or paste in the data. Add an asterisk to one of the field names and run the code to get it sorted. Then try with an asterisk on another field and try again.
Final remarks
Currently the app only can run JavaScript. Using WebAssembly and the Python emulator for WASM (Pyodide?), it may be fairly straightforward to extend the app and also allow generated Python code; the prompt would of course have to be adapted for that. I also consider adding a target DIV where an SVG object could be injected to have the code render visuals. And perhaps pre-loading a number of 3rd party libraries such as Leaflet and d3 and allow the LLM in the prompt to leverage these libraries.
When I used an LLM to generate the application I received two free suggestions: integrate a call to LLM APIs into the app (to support the step from prompt to the code in the same UI) and make the generated JavaScript run in a WebWorker — for improved decoupling and (sandbox) safety.
Conclusion
Of course this application is a silly thing from a technical points of view. However, the easy way it offers for code ignorami to run LLM generated code snippets in a simple, controlled way is actually quite valuable. I am sure many readers can create applications that look, feel and run much better than my tinker project. And I encourage them to create and share such products to make life nicer for many LLM users without any coding skills (or handy niece or nextdoor neighbour).
GitHub Repository for this Web App: https://github.com/lucasjellema/javascript-code-executor
