How Pipcook Empowers Front‑End Developers to Build Machine Learning Apps

Why Pipcook?

Pipcook is a machine‑learning application framework created by Alibaba's D2C team to give front‑end developers a platform for learning and applying AI, accelerating front‑end intelligence.

It consolidates projects such as imgcook, idaecook, and reviewcook—tools that generate code from design drafts, convert visual layouts to business code, and perform intelligent regression testing—under a reliable ML platform.

Flexible, Rich Pipeline

The core concept is a Pipeline, a JSON‑defined sequence of plugins that handle each stage of a machine‑learning workflow.

{
  "plugins": {
    "dataCollect": {
      "package": "@pipcook/plugins-mnist-data-collect",
      "params": {"trainCount": 8000, "testCount": 2000}
    },
    "dataAccess": {"package": "@pipcook/plugins-pascalvoc-data-access"},
    "dataProcess": {"package": "@pipcook/plugins-image-data-process", "params": {"resize": [28,28]}},
    "modelDefine": {"package": "@pipcook/plugins-tfjs-simplecnn-model-define"},
    "modelTrain": {"package": "@pipcook/plugins-image-classification-tfjs-model-train", "params": {"epochs": 15}},
    "modelEvaluate": {"package": "@pipcook/plugins-image-classification-tfjs-model-evaluate"},
    "modelDeploy": {"package": "@pipcook/plugins-model-deploy"}
  }
}

The stages include Data Collect, Data Access, Data Process, Model Define, Model Load (optional), Model Train, Model Evaluate, and Model Deploy, each encapsulated by a replaceable plugin to reduce cognitive load for users.

Stable Front‑End ML Ecosystem – Boa

Pipcook provides a runtime for each plugin and introduces Boa, a bridge that lets JavaScript invoke Python libraries directly, eliminating the need for separate bridge libraries.

const boa = require('@pipcook/boa');
const fs = require('fs');
const glob = require('glob').sync;
const acorn = require('acorn');

const { set, len, list } = boa.builtins();
const { DBSCAN } = boa.import('sklearn.cluster');
const { word2vec } = boa.import('gensim.models');

const cwd = process.cwd();
let files = [];
files = files.concat(glob(cwd + '/lib/**/*.js'));

const sentences = [];
const vec2word = {};
const samples = files
  .map(f => fs.readFileSync(f))
  .map(s => {
    let ast;
    try { ast = acorn.parse(s); } catch (e) { console.error('just ignore the error'); }
    return ast;
  })
  .filter(ast => ast !== undefined)
  .reduce((list, ast) => {
    const fn = ast.body.filter(stmt => stmt.type === 'FunctionDeclaration');
    list = list.concat(fn);
    return list;
  }, []);

samples.forEach(sample => sentences.push([sample.id.name]));

const { wv } = word2vec.Word2Vec(sentences, boa.kwargs({workers:1,size:2,min_count:1,window:3,sg:0}));
const X = sentences.map(s => wv.__getitem__(s)[0])
  .map((v,i) => {
    const r = [v[0]*100, v[1]*100];
    vec2word[r] = samples[i].id.name;
    return r;
  });

const db = DBSCAN(boa.kwargs({eps:0.9})).fit(X);
const labels = db.labels_;
const n_noise_ = list(labels).count(-1);
const n_clusters_ = len(set(labels));
console.log(n_noise_, n_clusters_, set(labels));

The code parses JavaScript files, extracts function names, converts them to vectors with Word2Vec, clusters them with DBSCAN, and demonstrates that Boa incurs no significant performance penalty because it interacts directly with Python objects.

Future – PipApp

Pipcook plans to introduce PipApp, an application framework for machine‑learning similar to Vue/React, allowing developers to declare ML tasks and data types while Pipcook handles data collection, processing, training, and deployment.

Typical CLI workflow:

$ pipcook train example.ts --epoch=15 --sample_path=...
$ pipcook try example.ts
$ pipcook deploy example.ts --eas-config=...

Developers can focus on what they want to achieve and integrate ML seamlessly with other Node.js functionalities.

How to Join Pipcook

Developers interested in the ML application framework can start with PipApp, explore Pipcook Client SDK for pipelines, or dive into the Plugin API for Boa and ecosystem stability. Contribution links and community resources are provided.