Best Practices to Scale Up Developer Productivity

We, at ShareChat, believe in working smart. Getting more out of every hour we put into our work. That not only means getting better results but also more peace of mind, more hours for learning, and more time for our families and passions.
With the tools at our disposal today, we should be able to work ten times faster than a developer a couple of decades back. Here are some insights on maximizing developer productivity, which we gathered from developers across the organization. However small some of these tips might feel, we promise they will bring a massive difference to your work.
First things first …
Being a great developer is not just about writing great code. We can never work to our full potential until we are healthy - both physically and mentally. We all know it. As programmers, we might sit for 8 to 10 hours a day which causes our backs to ache and generally take a toll on our health. Including some physical activity in our day will not only improve our physical health but our mental health as well. It could be dancing, swimming, working out at the gym, or something as simple as walking. Whatever you choose, make sure you enjoy it and look forward to it.

- Give frequent breaks to your eyes. Ideally every 20 minutes, look away from your screen at a distant object for about 20 seconds.
- Have a bottle by your side at all times and keep sipping.
- Have a good workstation set up and always work in proper posture.
- Get enough sleep.
- Nutritious and balanced diet.
- Stretch on your chair or walk every hour for 5-7 minutes.
Needless to say, programming can be a very intensive task. Taking care of mental health and ensuring you’re not overwhelmed is crucial. A few things that we swear by at ShareChat -
- Always break down your tasks into smaller, achievable, and well-defined subtasks.
- Leave notes/comments for yourself whenever you leave your screen to save yourself the energy of rethinking or getting back on your train of thought.
- Practice having a focus period every day for sure
- Development/learning. No meetings or other distractions at that time. We usually block focus hours on our calendars.
- If stuck, never linger for too long on any issue. If you can’t seem to make progress in an hour or so, reach out for help.
- Take small breaks of about 10 minutes every couple of hours. Take a short walk or stretch a bit. It not only gives you a much-needed break from sitting and the screen but also uplifts your mood, increasing productivity.
VS Code Extensions
Prettier

Prettier is a code formatter that helps to keep a consistent coding style. It is an absolute must if you have multiple people working on a single project. You can configure it to format your code every time you save it. It will automatically fix formatting issues in your code, like fixing the mix of single and double quotes or irregular use of semicolons.
Prettier is one of the most popular code formatters out there, with over 38.5k stars on GitHub. It works with the following technologies: JavaScript, TypeScript, Java, JSON, CSS, HTML, Vue, Angular, Markdown, YAML, and more.
GitLens

The GitLens extension lets you see who changed what line of code in your project. With a single click!
At the end of every line of code, GitLens exposes the author of the last commit, how long ago the commit was made, and other detailed blame information. The status bar blame shows similar information. Hovering over these annotations reveals details about the commit history for each line.
Import Cost


The Import Cost extension helps with productivity by showing the estimated size of an import package. This helps to avoid issues by tracking the size of added dependencies.
If an import is too large, the Import Cost extension will warn you so you can reconfigure based on the requirements.
Rest Client

REST Client allows you to send HTTP requests and view the response in Visual Studio Code directly.

If you take away just one thing from this section, it has to be this one. TabNine is an AI code assistant that will increase your development velocity with real-time code completions in all the most popular coding languages and IDEs.
TabNine works with all languages and the relevance of its hints is astounding. When you start using TabNine, you’ll be amazed at how quickly it learns and how much faster and easier your work will become.
GitHub Copilot provides a similar solution. It has lesser free features and is still in the testing phase. But might become promising in the future so you might want to keep an eye on it.
Tailwind intellisense

This extension provides autocomplete, syntax highlighting, and linting for Tailwind classes. With this extension, there is no need to memorize the exact spelling of all the utility classes or to spend time typing them out.
Regex preview

Regular expressions can be quite the puzzle to get right. Regex Previewer gives you a side document that matches your regex.
The extension gives multiple examples to match, so it becomes much easier to quickly and accurately write a regex for a variety of use cases.
Tools/Plugins to try
Bundle Phobia

BundlePhobia helps you to identify the cost and the impact of adding a new NPM package to your application. You can use the BundlePhobia website or the plugin to evaluate the size of the package beforehand and select the best one.
FfOpti

Image/video compression is something most developers do frequently. To do this efficiently and effortlessly, we at ShareChat came up with our custom compression service. “Ffopti” is the CLI tool for our compression service. You can compress multiple images, and videos simultaneously or even a folder. It will handle the extraction, filtration, and chunking to compress it very fast without consuming all the CPU power.
It was able to compress a folder of ten 4k videos with sizes 564.5MB to 28.8MB in 70 seconds. Thus it is quite fast and provides a high amount of compression.
For more information on this service, click here.
nvm / n (to manage multiple node versions)

nvm stands for Node Version Manager. As the name suggests, it helps you manage and switch between different Node versions with ease. It provides a command-line interface where you can install different versions with a single command, set a default, switch between them and much more.
‘n’ is another version manager for node. n is a Node module, which can be installed by npm whereas nvm is a Bash script. Both are actively maintained and are easy to use.
svgr (svg to react component automation)


If you are not converting your SVGs to React Components, you need to start now! This not only reduces the size of the image by removing the excess styling but also bundles them with JS. Hence no extra requests are made by the browser to fetch SVG images.
SVGR is a tool that handles all types of SVG and transforms them into a React component.
Ngrok / Localtunnel / Teleconsole
Have you ever felt the need to be able to share your local port with someone through a URL? Maybe you want to give a demo or test your application while it is still in the development phase. Tools like Ngrok / Localtunnel / Teleconsole help you do the same! And no you won’t need to deploy anything. It is as simple as running a CLI command and getting a public URL where your app is up and running. As you change your code locally, the changes will be reflected on the public URL almost immediately.
The most commonly used among these is ngrok. It is open-source and will expose your local port as a public URL through SSL which you can copy from the CLI. It provides secure tunnels to your local host server. This means that your localhost web server will receive the request through a public URL which is very handy if you need to share or demo or debug integration environments where it accepts only a public URL.
To be covered in part two of the blog -
- Tips/shortcuts to improve terminal experience
- Keyboard shortcuts
- Browser extensions
- TIPS for Work From Home - Peaceful and productive work environment, minimize distractions
We are hiring!
At ShareChat, we believe in keeping our Bharat users entertained in their language of preference. We are revolutionizing how India consumes content and the best in class Engineering technology is at the forefront of this transformation. In addition, you'll also get the opportunity to work on some of the most complex problems at scale while creating an impact on the broader content creation ecosystem.
Exciting? You can check out various open roles here!



