Be extremely productive with snippets setup, part of your flow

Snippets are extremely powerful. Because they hold the most critical element of productivity. And many people or a lot, do miss on their usage. And many do use them but not in an efficient difference-making way.

No AI ❗

• I don’t use AI in my writing. And if I do I would share the chat directly. Or mention it clearly. I do share my mind and thinking and love to exchange as well.
• Most of my articles are from my personal resume. As I do maintain a knowledge base. And write daily. Interestingly I made a switch to write directly in medium rather than my note app. To enable my ability to publish. And enable myself to tap on parallel time. Enabling and parallel time are both great notions. I’ll be sharing soon enough about the fascinating world of those terms.
• My content is long as I tend to go deep and explore and that’s always gonna be my style. I have immersion issues as well. Very awesome, thinking is limitless. But sometimes they can eat-up time where it shouldn’t.
• If you like my content. And want to not miss on new created one. You can subscribe for the notifications. I’ll be pushing content so consistently and at a high pace (inchlh).

TLDS (Too long do skim) — check the important headlines at the end (practical, examples and advise).

Productivity and speed

• Productivity is all about speed and output
• Quality is part of productivity
• Fast access is one supercritical element of productivity
• The speed of operation and going from None to Fully done. Is the essence of productivity
• Flow and integration with our nature is another critical property
• No need to remember, with fast access, is a critical property
• Lowering the friction is another property — The less you have to think or get stressed over things, get to wait on something, have to use more brain resources …. The more productive and more energy and focus power and time units you’ll be saving and using somewhere else that is valuable. Also, Friction is the number 1 reason for => going from wanting to do => To not doing. Seconds and counts in that matter. You may already experienced that so many times.
• Simplicity or simplification is another great property
• Mind organization is another good property. Putting structure to what you know …
• Tooling and enabling force is a critical concept of productivity
• As developers, we should absolutely, think and continuously our productivity, our speed. And all the properties that revolve around that (speed, fast-access, quality-with-speed, …).

Snippets are super power — And 100% should take part of your workflow

- Fast-access
- No need to remember
- Instant (literal 1 sec) — Faster than boiler copy, search …
- Speed — 1word and i’m 70% done.
- Lower friction — no need to search, to leave editor — fast access — speed
- Allow you to maintain quality. And organize your mind. — Chatgpt, Copilot … we are better off now. But even so — snippets are what you set yourself as the ideal final thing. Its a framework for organizing and maintaining quality and standard. Beside that tailor speed of access to yourself with all control.
- For organizing the mind. With snippets you can organize the design patterns, The algorithms, the hacks, the optimization, Just about anything. All in one instant access. Great instant search capability (vscode ability) and way more.

Ok all cool. But !

To really build real productivity. You have to be super serious about it. And think metrics and real properties. The biggest one for success and the one that may be most people struggle with. Is creating and integrating the natural daily flow. So for snippets. They need and must become part of your natural flow.
- Details below

Note:

• ✨ If you have a great experience with snippets and productivity as dev. Or rely to something in this article. Please share some insight with us. Share your experience. Great hacks. Anything deemed helpful for others. I’ll make sure to add every ounce of possible value here.

✨ Embrace the snippets, part of your workflow ❗

• The integration of any productivity tip, methodology, or tool … is the most critical part of all. Because without it. You have but only ideas and thoughts.
• For any productivity thing => Always do all to integrate and make the productivity mechanism part of your flow and natural life or space.
• A great methodology about seriousness in such kinds of things. Is just the analytical mind. And the simple question is what is blocking me? What is standing against my enabling? And how can I enable this power?
  ◌ Knowing the blocker, the why you are not already implementing it. Is a big thing and first step.
  ◌ The answers may vary. And solution will popup simply. If not. Then => YOU PROBLEM SOLVE => This is seriousness. And this is making a difference. Ask how can I.
  ◌ When you think property, and you go analytically. You’ll know so fast and easily. And if it’s so no intuitive or not so easy. Then if you come up with creative solutions. You gonna enable yourself and standout.
  ◌ That was a general construct and a mindset thing. The reality is, in most of the time is it’s so damn simple. It was always there. We just didn’t do anything to see it. Or we were lazy. Or we allowed the flow of life to take us. And we never made any move.

A one 5 mintues, a one 15 minutes a one day, a two days. Can enable what would a huge difference beyond count. An extreme diff in growth curve and capabilities. Up to years won of difference. And absolutely one hunder percent. And i can give you thousands of examples endlessly. I’m culprit myself of many of the things above. I learned from experience. I’m taking productivity serious now. And exploring it. I’ll be always investing more and more in it. Here a set of big words for you Real parallel time, Enabling, Space time binding

• Let’s go back from abstract and general to snippets for now. (There will be a whole series on productivity. There will be time for every bit and nuance)

Frictionless, Snippet extension, the snippet integration with flow

• ✨ For snippets, it’s very simple. You need a small enabling. => Removing friction. Generally, the vscode default way of creating snippets does have friction. Have to pick up what language, navigate, copy paste … With an extension none of those will be needed. Full simplification.
  ◌ Just select the code
  ◌ one shortcut (not even through command pallet)
  ◌ set the triggering keyword name. And you are done.
  ◌ You can add extra tags for search if you want.
• That alone is huge. Personal experience. I started using snippets early, years ago. But they weren’t part of my daily natural flow. I casually create some. And that’s due to the friction. I’m changing everything at many levels of my life. And I’m investing in productivity. And asking the right questions is critical. So how do you make snippets part of your flow?
  ◌ Once friction is down. It will come to you. You need to take the 10 seconds. To select the code and tap the shortcut. Write a very well-searchable keyword. That’s all it takes. You have to flip your mind so you start doing that for a lot.
  ◌ If you can’t do it for almost everything. The best strategy is You do it in chunks. Do it now. no more for the next 30 mins. Do it again … (Do — timeout — Do — Timeout — …), see the timeout that works for you and your flow. Also, for a lot, things would come only casually. And when you are going through new things. Integrate the flow naturally. That nature will make a huge difference. And at many levels. Also the thing is about doing it for everything that matters and makes you more productive. And remember it’s all about productivity. Being able to do it fast. So basically the integration is so simple. For any issue, there is a simple fix.
• If you are flexible invest and profit. If you fear it hinders your workflow. Do it routinely or in a discontinued, well-timed way (Great freq). cross the day. You’ll find your best natural flow integration cross just starting and taking it seriously. (Frequency through the day is a great concept. The Freq power)
• I’ll say no more. let’s see some examples and some fundamentals

✨ General examples and benefits

• Configuration files (eslint, commilint, tsconfig, lefthook, and just about anything you use daily.)
  ◌ snippet => create file => tsconfig => pick => done (5sec) no friction
  ◌ Organized Boiler or another project => Open => wait for it to open => Fine the file => copy => go back => past
  ▶︎ Friction, 15sec to 1min to way more (possible confusion, not found …)
  ▶ B︎oiler is too great when you have multiple files ….
  ▶︎ Surely better tooling can allow better flows
  ◌ Find it online => open browser => open google => search => filter result => open multiple tabs Or search for the probable one article you have seen => navigate through the file => then copy => then back to editor => create file => paste (long)
  ▶︎ Friction, consume time, may get lost, not find …
  ▶︎ A good browser flow, is to use bookmarks efficiently. it can be good. And use Quick links as well (if you use Raycast (macos only) or Albert (ref2) or something similar)
  ▶︎ It will still have some friction in all cases
  ◌ Chatgpt, Copilot. => Within vscode is more productive. Outside extra friction but also too great
  ▶ ︎The main issue with Chatgpt is you will get what chatgpt gives you. Not what you defined and you are ready to go with. With gpt you can go fast or slow all depends.

In short, snippets are too powerful up to unbeatable. And generally, we would use multiple tools to achieve the best productivity. For each type of things, we go with the best options. In our type of work. In most of the cases, snippets are the best. In others boiler. Otherwise, we do fall back to what works the best, giving the situation and status.

• Code snippets that you use continuously
  ◌ One good way is to set snippets for practical parts of programming (filesystem, iterating through files with globs, renaming files, Manipulating images, API, events, looping, filtering, text processing ….) — surely the list is endless. And basically we can either lazzy load or eager load. Meet the thing and than create snippet. Or go extra miles and thing of what you need generally and do that from time to time or at the lazzy load moment as well. Each what works best for.
• Design patterns, Algorithms, Data Structure, Concepts, Structures, cases, tests patterns …
  ◌ Snippets are a great way to organize your mind and the practical. Always keep them practical. And the property of fast search and access is just too powerful that we can do a lot with.
• Live coding leveling up. You are passing an interview or just work. The power of snippets is beyond say. One great property for snippets is to not need to remember. You think and push what you make when you are writing the snippet. But then you don't need to keep remembering all. Fast access at any time. Through easy search. Snippets make a great tool for environments where you are limited in time. Where you can go through a lot. And understand deeply and even push further and elaborate on your own things. But no need to remember. Snippets are a great solution for no needing to remember. That it is for a tight space or just in general. And it is a great tool for live coding. Timed challenges and competitions and for interview as well ….

The examples can be many. I’m giving some to just show the power. Because if you don't understand the size of it’s power. You’ll miss on it like nothing. Look around and see how much are truly enabling the power of snippets.

✨ A practical example

We have terser which only support one to one file processing outputing. How would you do to make terser process the files in a folder in a recursive nested manner, keeping the structure in the output. ??

• ▶︎ First this is a general problem. For all problems of such type, you need now to have a fast productive flow for
  ◌ Specific Case: Terser: run on multiple files using globs and unblock yourself from the issues
  ◌ Generalization: Npm scripts — running commands with globs expansion for each file
  ▶︎ I will establish this: No flow => First time take time => Either => keep no flow => always taking time even if less => Or make a flow and make it a matter of seconds.
  ◌ Snippets are a solution for establishing some types of productive flows.
• You would need to use globs !?
• How long would that take you ?
• First, it would take you and long enough. Including if you just ask GPT.
• If no snippet. Most likely every time you gonna spend the same amount of time to redo something similar. Otherwise, you would do with something and a way that has friction
• With a snippet or sinppets => it would take typing glob_cmd => and the base is there. You implement your case. No friction, instant. Huge difference and productivity. If we talk time. that can go from wining 5 minutes to 30 minutes or even an hour or more. Depending if you are going to re-use anything or go fully from scratch and just a little knowledge like hey using glob. That includes special cases. If i fall in a special case. I will create a snippet. Same case again flash fast. Just like the cache system works. Let’s cache things in our life.

Terser Example:

/**
 * npm install fast-glob
 */
const { spawn } = require('child_process');
const fastGlob = require('fast-glob');
const path = require('path');
const fs = require('fs');
const fsp = fs.promises;

const rootDir = path.resolve(__dirname, '..');
/**
 * Relative path to root
 */
function root(relPath) {
  return path.resolve(rootDir, relPath);
}
/**
 * Resolve alias
 */
function r(..._path) {
  return path.resolve(..._path);
}
/**
 * File selection
 */
(async () => {
  const glob = './dest/js/**/*.js';
  // const globIgnore = '';
  const files = await fastGlob(root(glob));
  files.forEach(async (file) => {
    // Note: file is absolute (fastGlob default)
    console.log(`file: ${file}`);
    const fileParse = path.parse(file);
    const { name, ext, dir } = fileParse;
    const reldir = path.dirname(path.relative(root('dest/js'), file));
    // console.log(`reldir: ${reldir}`);
    const outFile = root(`dest/minified/${reldir}/${name}.min${ext}`);
    console.log(`outFile: ${outFile}`);
    // Pre-commands
    await fsp.mkdir(path.dirname(outFile), { recursive: true });
    // Commands
    command = `npx terser ${file} -o ${outFile} -c "ecma=6,toplevel" -m "toplevel,eval" --mkdir`;
    spawn(command, { stdio: 'inherit', shell: true });
  });
})();

✨Snippet everywhere, any place

• You should use them for every possible speed-up.
• code, config files, markdown, text, just about in every place where it makes sense.

✨ How to make great snippets ✨

• To make great snippets. You have to meet the following
  ◌ good smart trigger keyword -> so that you can easily search for it and find it
  ▶︎ Even when you fully forget and come a year later (design for any future time, even after years)
  ▶ The best way is to use something like glob_cmd_run_parallel_spawn_base_placeholders
◌ Wait a second, are you serious? Yes, i am! It’s like tags, for search. You can do what you want and what works for you. But know that vscode is efficient. So long is no issue. Also, know that IntelliSense in vscode has an efficient fuzzy search. You only write part of the whole Example globplac , that alone can get the long one above. Make sure you test and keep in mind what would allow you to do it even faster. The above long keyword. I can fast access in more than one way. I would see what works too fast.
  ◌ Create a snippet that is productive. And productive, comes from speed of operation. So design them for speed of operation. Here down some ideas
  ▶︎ Add install packages commands in a top comments section
  ▶︎ Make sure you cover up the need efficiently
  ▶︎ You can have comments. Or extra things
  ▶︎ You can have multiple snippet variations. Keep same naming for trigger keyword. With more different parts at the end regex_search, regex_search_with_group, regex_search_with_lib_dragon
  ▶ ✨ Here a great one. Add critical notes that help you remember things. In the snippet above i did add // Note: file is absolute (fastGlob default). In a year i’m not sure i can remember what is the default for fastGlob. And if fastGlob default is the inverse of glob package. So when it’s absolutely critical a note comment is so powerful and valuable.
  ▶ A list of helpers that you may need or not easy to delete. (You can have a neat variant with no helpers and another with)
  ◌ You are free. Have your snippets powerful and useful to you and what you stand for. Otherwise, Packages dependencies, critical notes, and documenting. A list of helpers that you may need or not easy to delete. You can have for documentation, a section on top or bottom. Easy to delete. anything easy to delete wouldn’t take you time.
  ◌ Keep your snippets neat. Organized, production ready. And remember you can always improve them later on.
  ◌ Get familiar or design your snippet with productivity in mind. Vscode have many features. Including CMD + D for duplicate selection. You can use such things for more efficiency. Here an example

◌ Ask yourself about what other vscode features i can use to be productive.

Snippet Extension suggestions

(i’ll be doing only vscode, if you are using another editor, and know of something great, please share in the comments)

Vscode

• Use a snippets extension. That allows you to move fast. And quickly create snippets. With zero friction. And no downtime.
• [This section will be updated later]
• I personally tried different ones, once in the past. for the moment i’m using this extension, am not fully 100% happy with it, i think there were some slightly better ones (All are somehow similar, the variations however can make difference). I believe it could have been better. But so far it does help me be productive. I’m planning to make my own soon enough when I'll get to it}
• I did outside vscode + vscode plugin solutions like SnippetStore (archived), MassCode
  ◌ SnippetStore archived and doesn’t support a large set of snippets. Could have been great. (There will be a great tutorial about some advanced UI js topics, where SnippetStore is the playground )
  ◌ MassCode is something that I would give some credit for. At the time there were some slight issues, I don’t remember what. But I guess it’s a serious project and it’s growing further. I preferred by then the vscode extension. And now i have something better in mind.
• I’m counting on building my own, super-powerful tool. I’ll be updating you. And stay tuned.
• Also, i didn’t test another extension as the one above was letting me be productive with zero friction. One friction i have with it is when i want to update a snippet. But it’s not much of a one.

[Please, if you try some good options out there, share in the comments. I’ll check and update the article]

✨ Productivity part of A company culture

• The last company I worked for we had a great culture of continuously leveling up our flows, and our standards and also helping the team members grow or just implement enabling systems.
• Enabling as a concept is too powerful. And one of the great leaders traits. Also enabling is a smart play element and concept. Giving what you are giving. You just let things be (aware or not aware), or complain. Or basically, you enable. And the magical thing is. Enabling can be through small things. A very small invested time. Really, 5 minutes can make a whole difference. a 15 minutes an hour.
• Flows are a serious matter.
• Adding more powerful things to your flow. And having a company philosophy and systems that enable more by nature. Is just like a smart play that basically every company should have.
• Snippets adoption and productivity things, standard things, efficiency things …. All should be part of such enabling.
• If a company doesn’t have time for it. Thinking so. Time is there. The management isn’t. Many times awareness is lacking. Then it’s always relative. In all cases, such an enabling can be delegated to a very capable professional. And it’s simple you can see any great companies, ask about flows, and hire one to implement that for you and it doesn’t take much. Otherwise. Stop take just a moment. Do it in a discontinued manner. Before you know you’d have enabled a lot.
• And such things go from onboarding to enabling starting fast, to productivity and flows, To efficiency and checklists …