loading...
Cover image for TabNine - Put your coding speed to the next level

TabNine - Put your coding speed to the next level

nicolalc profile image Nicola ・4 min read

Deep learning at the rescue! 👨‍💻👩‍💻

In this article I'll talk about TabNine, an AI Code Completion system for all languages, with a focus on JavaScript.

TabNine is a plugin owned and operated by Codota, who offers also a plugin for Java Code Completions.


What is TabNine?

TabNine helps developers writing code with some magics. It's based on a system of deep learning to help you writing code:

  • FASTER
  • EASIER
  • CLEANER

It's a free (yes, free) plugin for major IDEs like:

  • IntelliJ PyCharm
  • VS Code
  • Sublime
  • IntelliJ PhpStorm
  • VIM
  • Atom

and many others:

TabNine supported IDEs


How does it works?

TabNine indexes your code and finds statistical patterns to create customized suggestions based on how you write your own code.

Take the following example:

Auto var declaration

As shown TabNine learns automatically my variable declaration pattern while writing it, and suggest me the best match for the code I'll write after. By this way you can speed up variable declarations, if you use a well defined naming convention.

TabNine offers different solutions while writing, and displays a percentage value based on the best match he find:

Percent on suggestions

This is a simple example to show how TabNine helps you write your code, the next examples will show more complex and ordinary-like use cases of this amazing tool!

Note: This article is written in MarkDown and TabNine is helping me writing it! That's pretty cool! 😎

Markdown edit with TabNine


Install

TabNine is an IDE plugin, so the installation process depends on which IDE you are using. I'll show the installation process for some of the most used IDEs:

Visual Studio Code

  1. Press CTRL + P to open the command prompt.
  2. Run the following command:
  ext install TabNine.tabnine-vscode
  1. Reload VS Code manually or by after-install prompt.

IntelliJ Idea

  1. Press CTRL + Alt + S to open the settings popup
  2. Go under Plugins/Marketplace
  3. Search TabNine and install
  4. Manually reload the IDE

Atom

  1. Under packages you can simply search and install TabNine

You can check installation process for other IDE here.


Examples

Let's go deep on how to use TabNine and why. There are a lot of examples I could show you but I'll focus on some specific use cases.

Example 1. Comment-Driven code completition

With TabNine we can use jsdoc to generate functions and complex objects dinamically. This could be useful by defining the interface first and then the implementation.

Take this example, we want to define a sum function:

/**
 * @description return a sum between a and b
 * @name        sumBy
 * @param       {number} a
 * @param       {number} b
 * @return      {number} the sum between a and b
 */

TabNine will read the jsdoc params and suggest you the correct code definition.
I can just type Alt + Space (or Tab) to write the function:

Comment driven completition

Classes development and extension

You can also use this tool with class definition. Take this example:


/**
 * @description Animal class
 */
class Animal {
  /**
   * @constructor
   * @param {string} name - name of the animal
   * @param {boolean} quadruped
   */
  constructor(name, quadruped) {
    this.name = name;
    this.quadruped = quadruped;
  }

  /**
   * @description returns the name of the animal
   * @returns {string} - name of the animal
   */
  get name() {
    return this.name;
  }

  /**
   * @description sets the name of the animal
   * @param {string} name - name of the animal
   */
  set name(name) {
    this.name = name;
  }
}

We want to extend this basic class with a Cat class, TabNine will learn about the Animal class and suggest the method implementation and comments:

Comment driven completition with classes

Example 2. Function parameters auto completition

Often in Javascript it's hard to complete the function parameters without typings. TabNine is useful in this case because it learns from your code and suggests the method implementation:

Function parameter auto completition

The parameters of methods sumBy and diffBy are displayed automatically by TabNine, so you don't have to check the method implementation directly to check what kind of parameters the methods accepts.


TabNine and Typescript

There aren't a lot of differences for TabNine behaviours between JavaScript and TypeScript. TabNine will give you more precise suggestions because of Typings, so will get all the advantages types gives to your code:

Function parameter completion using TypeScript

As you can see, I've defined param1, param2 and param3 in different orders and types compared to the foo function.
TabNine is recognizing the variable types and suggest to you the correct order.


Thanks to:

  • Codota for letting me writing this article and be part of they're amazing project
  • clideo.com, an amazing online tool for video editing (you can also make memes with it 😎)
  • onlineconverter.com, to convert video to GIF, and much more!

Posted on by:

nicolalc profile

Nicola

@nicolalc

I'm a FrontEnd developer, specialized on Angular platform. I love design and music!

Discussion

markdown guide
 

It's free-ish. It's proprietary SAAS, so it needs an Internet connection to run and will fail if the developers decide to make it fail, for whatever reason.

It's interesting tech, and I used it a year or so ago in Vim for about a month before getting fed up with some of its idiosyncrasies and falling back to regular omni-completion.

 

Yes, of course, is still imperfect. I've used it for a couple of months with a full enterprise project and nowadays is more "smart" than the first days because it has learned from my patterns and naming conventions.

Is based on deep learning so it needs a lot of data to learn and improve itself, I think it could be really useful on non-typed languages like JS.

 

Well after your article I decided to try it out. Won't be free for me on my project but it's already looking very interesting. Annoying that it corrects me in Markdown and not always when I notice! Thanks for this.

I'm glad it runs all locally - very important that for my stuff.

 

Hi Mike! Thanks for trying it!

Yes sometimes it's pretty annoying but it strongly depends on which IDE are you using and your coding speed!

To fix that I think you need to think in a different way while you write your code, personally I switched from auto-completion to driven-completion (lol what's that 😂).

Basically, before using TabNine I was tabbing everything, letting the IDE complete the code for me.
Now with TabNine, I wait for its suggestions before tabbing (or alt-spacing) and let it write the right code for me. That's what I call a driven-completion.

I swear this might help you, any way you need a bunch of time to master this new way of coding.

PS. If you well document your code before writing it, the suggestions will be more precise.

 

Yeah I'm not sure why it's autocorrecting Markdown - on Webstorm - my CHANGELOG.md randomly has a version number that isn't right lol.

I can see what you mean on the tab to complete stuff, definitely interesting given all of the more complex structures it suggests. Never been a fan of editor shortcuts, but maybe....

Damn, that's strange at all!

I think the plugin is reading all your files, and maybe it touches them.

According to FAQs:

Since TabNine does not parse your code, it will never stop working because of a mismatched bracket.

I don't think it's changing your file metadata or something like that. Can I ask you to provide an example of what's happening? Maybe I can help you!

Well it's active in my Markdown - offering suggestions, which is a little unhelpful really - I'm not expecting my English to change on Enter

I typed this:

#### 2.1.50

- Handle the case where the Promise yielded is immediately resolved without
  going through the restart process

And it stuck a 7 on the end of the version number

It helps you with code first, and it "works" also with markdown, but as a syntax language it tries to help you with some suggestions calculated on your code, so it could mess a little bit up. Anyway, I've tried on a new markdown file and It's not happening, I think it is because is learning from your code and somehow it matches the wrong words. I'll check TabNine devs for that to learn more about this behaviour.

 

I absolutely adore TabNine, I have been using it for about 3 weeks for at least 8 hours a day in an angular project and it has been such a help with almost everything that annoys me with web development. Need to write log messages? Need to write things that are repetitive and boring ? TabNine got you covered!
Thank you so much for developing this gorgeous type of software!

 

Happy to hear that! Unfortunately, I didn't develop it I just wanted to share an amazing tool to you all!

I'm using it in an enterprise angular project, I want only to improve your comment saying than using typescript and tsdoc this amazing plugin do the rest for me.

 

Great work I'm sriram fullstack javascript developer I have a whatsapp group dedicated to coders so that you can chat and collaborate on fun hobby projects with real people if you are interested please ping me at +918970787208

 
 

Yes, the logic behind is the same, but TabNine supports different IDEs. I think this is the main difference.

Maybe I need to check which one is the best and make an article about that?

 

It looks like a nice tool! Thanks for sharing it, Nicola!

 

Thanks to you! It's a pleasure for me!

 

Only problem I had with it was the RAM usage, my system couldn't handle it.

 

Oh wow, how much RAM do you have?

 

16GB, but I run other RAM dependent applications like docker and chrome. At one point TabNine was using 6GB 😅

Lol what that's too much! For me is like 1gb at max!