<commit_before><div class="index-hero">
  <div class="hero-title">
    <img src='images/TF_JS_lockup.png' alt="TensorFlow.js"></img>
    <p>
      A WebGL accelerated, browser based JavaScript library for training and deploying ML models.
    </p>
  </div>
</div>
<div class="page index-page">


  <div class="content">
    <div class="value-props">
      <div class="proposition">
        <div class="title">Develop ML in the Browser</div>
        <span>
          Use flexible and intuitive APIs to build and train models from scratch using the low-level JavaScript linear algebra library or the
          high-level layers API
        </span>
      </div>

      <div class="proposition">
        <div class="title">Run Existing models</div>
        <span>
          Use TensorFlow.js model converters to run pre-existing TensorFlow models right in the browser.
        </span>
      </div>

      <div class="proposition">
        <div class="title">Retrain Existing models</div>
        <span>
          Retrain pre-existing ML models using sensor data connected to the browser, or other client-side data.
        </span>
      </div>


    </div>

    <div class="demos">
      <h1>Demos</h1>

      <div class="demo-block">
        <div class="info">
          <div class="title">
            <a href="https://emojiscavengerhunt.withgoogle.com/" target="_blank">Emoji Scavenger Hunt</a>
          </div>
          <div class="blurb">
             Use your phone’s camera to identify emojis in the real world. Can you find all the emojis before time expires?
          </div>

          <div class="ctas">
            <a href="https://emojiscavengerhunt.withgoogle.com/" target="_blank">
              <button class="mdc-button mdc-button--raised">Go to Demo!</button>
            </a>
            <a href="https://github.com/google/emoji-scavenger-hunt">
              <button class="mdc-button mdc-button--raised">Code</button>
            </a>
          </div>
        </div>
        <img src="images/EmojiScavengerHunt.png">
      </div>

      <div class="demo-block">
        <div class="info">
          <div class="title">
            <a href="https://storage.googleapis.com/tfjs-examples/webcam-transfer-learning/dist/index.html" target="_blank">
             Webcam Controller
            </a>
          </div>
          <div class="blurb">
            Play Pac-Man using images trained in your browser.
          </div>

          <div class="ctas">
            <a href="https://storage.googleapis.com/tfjs-examples/webcam-transfer-learning/dist/index.html" target="_blank">
              <button class="mdc-button mdc-button--raised">Go to Demo!</button>
            </a>
            <a href="https://github.com/tensorflow/tfjs-examples/tree/master/webcam-transfer-learning">
              <button class="mdc-button mdc-button--raised">Code</button>
            </a>
          </div>
        </div>
        <img src="images/pacman-controller.png">
      </div>

      <div class="demo-block">
        <div class="info">
          <div class="title">
            <a href="https://teachablemachine.withgoogle.com/" target="_blank">
              Teachable Machine
            </a>
          </div>
          <div class="blurb">
             No coding required! Teach a machine to
             recognize images and play sounds.
          </div>

          <div class="ctas">
            <a href="https://teachablemachine.withgoogle.com/" target="_blank">
              <button class="mdc-button mdc-button--raised">Go to Demo!</button>
            </a>
            <a href="https://github.com/googlecreativelab/teachable-machine"  target="_blank">
              <button class="mdc-button mdc-button--raised">Code</button>
            </a>
          </div>
        </div>
        <img src="images/teachablemachine_preview.jpg">
      </div>

      <div class="demo-block">
        <div class="info">
          <div class="title">
            <a href="./demos/performance_rnn" target="_blank">
              Performance RNN
            </a>
          </div>
          <div class="blurb">
            Enjoy a real-time piano performance by a neural network
          </div>

          <div class="ctas">
            <a href="./demos/performance_rnn" target="_blank">
              <button class="mdc-button mdc-button--raised">Go to Demo!</button>
            </a>
            <a href="https://github.com/PAIR-code/deeplearnjs/tree/master/demos/performance_rnn">
              <button class="mdc-button mdc-button--raised">Code</button>
            </a>
          </div>
        </div>
        <img src="images/performance_rnn_preview.jpg">
      </div>

    </div>


    <div id="getting-started" class="getting-started">
      <h1>Getting Started</h1>
      <p>
        You can use TensorFlow.js by installing it from NPM or via script tags.
      </p>

      <h3>Installation</h3>
      <div class="gs-code">
        <pre><code class="lang-shell">yarn add @tensorflow/tfjs</code></pre>
        <pre><code class="lang-shell">npm install @tensorflow/tfjs</code></pre>
      </div>

      <div class="gs-code">
        <pre>
          <code class="lang-html">&lt;script src="https://cdn.jsdelivr.net/npm/tfjs@{{latestVersion}}"&gt;&lt;/script&gt;</code>
        </pre>
      </div>


      <h3>Usage</h3>
      <p>
        See our <a href='./tutorials'>tutorials</a>,
        <a href='https://github.com/tensorflow/tfjs-examples' target="_blank">examples</a>
        and <a href="./api/{{latestVersion}}/">documentation</a> for more details,
        but let's see what it looks like to train a simple model in TensorFlow.js:
      </p>
      <div class="gs-code">
<pre>
  <code class="lang-js">
  import * as tf from '@tensorflow/tfjs';

  // Define a model for linear regression.
  const model = tf.sequential();
  model.add(tf.layers.dense({units: 1, inputShape: [1]});

  // Prepare the model for training: Specify the loss and the optimizer.<commit_msg>Update script tag url to include org<commit_after><div class="index-hero">
  <div class="hero-title">
    <img src='images/TF_JS_lockup.png' alt="TensorFlow.js"></img>
    <p>
      A WebGL accelerated, browser based JavaScript library for training and deploying ML models.
    </p>
  </div>
</div>
<div class="page index-page">


  <div class="content">
    <div class="value-props">
      <div class="proposition">
        <div class="title">Develop ML in the Browser</div>
        <span>
          Use flexible and intuitive APIs to build and train models from scratch using the low-level JavaScript linear algebra library or the
          high-level layers API
        </span>
      </div>

      <div class="proposition">
        <div class="title">Run Existing models</div>
        <span>
          Use TensorFlow.js model converters to run pre-existing TensorFlow models right in the browser.
        </span>
      </div>

      <div class="proposition">
        <div class="title">Retrain Existing models</div>
        <span>
          Retrain pre-existing ML models using sensor data connected to the browser, or other client-side data.
        </span>
      </div>


    </div>

    <div class="demos">
      <h1>Demos</h1>

      <div class="demo-block">
        <div class="info">
          <div class="title">
            <a href="https://emojiscavengerhunt.withgoogle.com/" target="_blank">Emoji Scavenger Hunt</a>
          </div>
          <div class="blurb">
             Use your phone’s camera to identify emojis in the real world. Can you find all the emojis before time expires?
          </div>

          <div class="ctas">
            <a href="https://emojiscavengerhunt.withgoogle.com/" target="_blank">
              <button class="mdc-button mdc-button--raised">Go to Demo!</button>
            </a>
            <a href="https://github.com/google/emoji-scavenger-hunt">
              <button class="mdc-button mdc-button--raised">Code</button>
            </a>
          </div>
        </div>
        <img src="images/EmojiScavengerHunt.png">
      </div>

      <div class="demo-block">
        <div class="info">
          <div class="title">
            <a href="https://storage.googleapis.com/tfjs-examples/webcam-transfer-learning/dist/index.html" target="_blank">
             Webcam Controller
            </a>
          </div>
          <div class="blurb">
            Play Pac-Man using images trained in your browser.
          </div>

          <div class="ctas">
            <a href="https://storage.googleapis.com/tfjs-examples/webcam-transfer-learning/dist/index.html" target="_blank">
              <button class="mdc-button mdc-button--raised">Go to Demo!</button>
            </a>
            <a href="https://github.com/tensorflow/tfjs-examples/tree/master/webcam-transfer-learning">
              <button class="mdc-button mdc-button--raised">Code</button>
            </a>
          </div>
        </div>
        <img src="images/pacman-controller.png">
      </div>

      <div class="demo-block">
        <div class="info">
          <div class="title">
            <a href="https://teachablemachine.withgoogle.com/" target="_blank">
              Teachable Machine
            </a>
          </div>
          <div class="blurb">
             No coding required! Teach a machine to
             recognize images and play sounds.
          </div>

          <div class="ctas">
            <a href="https://teachablemachine.withgoogle.com/" target="_blank">
              <button class="mdc-button mdc-button--raised">Go to Demo!</button>
            </a>
            <a href="https://github.com/googlecreativelab/teachable-machine"  target="_blank">
              <button class="mdc-button mdc-button--raised">Code</button>
            </a>
          </div>
        </div>
        <img src="images/teachablemachine_preview.jpg">
      </div>

      <div class="demo-block">
        <div class="info">
          <div class="title">
            <a href="./demos/performance_rnn" target="_blank">
              Performance RNN
            </a>
          </div>
          <div class="blurb">
            Enjoy a real-time piano performance by a neural network
          </div>

          <div class="ctas">
            <a href="./demos/performance_rnn" target="_blank">
              <button class="mdc-button mdc-button--raised">Go to Demo!</button>
            </a>
            <a href="https://github.com/PAIR-code/deeplearnjs/tree/master/demos/performance_rnn">
              <button class="mdc-button mdc-button--raised">Code</button>
            </a>
          </div>
        </div>
        <img src="images/performance_rnn_preview.jpg">
      </div>

    </div>


    <div id="getting-started" class="getting-started">
      <h1>Getting Started</h1>
      <p>
        You can use TensorFlow.js by installing it from NPM or via script tags.
      </p>

      <h3>Installation</h3>
      <div class="gs-code">
        <pre><code class="lang-shell">yarn add @tensorflow/tfjs</code></pre>
        <pre><code class="lang-shell">npm install @tensorflow/tfjs</code></pre>
      </div>

      <div class="gs-code">
        <pre>
          <code class="lang-html">&lt;script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs@{{latestVersion}}"&gt;&lt;/script&gt;</code>
        </pre>
      </div>


      <h3>Usage</h3>
      <p>
        See our <a href='./tutorials'>tutorials</a>,
        <a href='https://github.com/tensorflow/tfjs-examples' target="_blank">examples</a>
        and <a href="./api/{{latestVersion}}/">documentation</a> for more details,
        but let's see what it looks like to train a simple model in TensorFlow.js:
      </p>
      <div class="gs-code">
<pre>
  <code class="lang-js">
  import * as tf from '@tensorflow/tfjs';

  // Define a model for linear regression.
  const model = tf.sequential();
  model.add(tf.layers.dense({units: 1, inputShape: [1]});

  // Prepare the model for training: Specify the loss and the optimizer.
{'fraction_non_alphanumeric': 0.14799966591497535, 'fraction_numerical': 0.0016704251231938528, 'mean_word_length': 2.054591836734694, 'pattern_counts': {'":': 0, '<': 311, '<?xml version=': 0, '>': 311, 'https://': 24, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 2, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '216397', 'n_tokens_mistral': 3682, 'n_tokens_neox': 3550, 'n_words': 849}