Just start using WSL

Loránd Márton — Sun, 13 Oct 2024 15:13:28 +0000

Introduction

WSL lets you run Linux on your Windows machine, giving you access to the best of both worlds for development.

Get an awesome tool: WSL

To install WSL, open the terminal and run the following command:

wsl --install --no-distribution

This command installs WSL without the default Ubuntu distribution. If the wsl command doesn't work use wsl.exe instead.

Restart your computer, to complete the installation.

To check the list of available distributions, run:

wsl --list --online

You should see something like this:

NAME                            FRIENDLY NAME
Ubuntu                          Ubuntu
Debian                          Debian GNU/Linux
kali-linux                      Kali Linux Rolling
Ubuntu-18.04                    Ubuntu 18.04 LTS
Ubuntu-20.04                    Ubuntu 20.04 LTS
Ubuntu-22.04                    Ubuntu 22.04 LTS
Ubuntu-24.04                    Ubuntu 24.04 LTS
OracleLinux_7_9                 Oracle Linux 7.9
OracleLinux_8_7                 Oracle Linux 8.7
OracleLinux_9_1                 Oracle Linux 9.1
openSUSE-Leap-15.6              openSUSE Leap 15.6
SUSE-Linux-Enterprise-15-SP5    SUSE Linux Enterprise 15 SP5
SUSE-Linux-Enterprise-15-SP6    SUSE Linux Enterprise 15 SP6
openSUSE-Tumbleweed             openSUSE Tumbleweed

Install one of these distributions with:

wsl --install <Distro>

This command will install your chosen distribution. For getting familiar with WSL, Ubuntu or Debian are good starting points.
When installed, you have to choose username and password.

If you install multiple distributions, you can set a default with:

wsl --set-default <DistributionName>

Setting a default distribution ensures that when you open WSL without specifying a distribution it will start your preferred environment.
You can either start the distribution, you can use the current working directory or the distribution's user home directory:

Current working directory:

wsl

User's home directory:

wsl ~

To list the installed distributions, run:

wsl --list --verbose

Check the running distributions:

wsl -l --running

Stop a running distribution:

wsl --terminate <Distribution Name>

WSL is a powerful tool that brings the Linux experience directly into Windows, allowing for a flexible development environment.

References

WSL Basic Commands - Microsoft Learn

Optimizing a Webpack project to improve the performance and user experience

Loránd Márton — Thu, 19 Jan 2023 11:42:18 +0000

Webpack is a powerful tool for building and bundling JavaScript applications, but it can also result in large, slow-to-load bundles if not optimized properly. In this article, we will discuss some techniques for optimizing a Webpack project to improve the performance and user experience of your application.

Use code splitting: One of the most effective ways to reduce the size of your bundle is to use code splitting. This allows you to break up your application into smaller chunks, so that only the code that is needed for a particular page or feature is loaded. You can use the splitChunks option in the optimization section of your webpack config to configure code splitting.
Minify and uglify your code: Minification is the process of removing unnecessary characters and whitespace from your code to make it smaller. Uglification is the process of making your code more difficult to read and understand. Both of these can be achieved using the terser-webpack-plugin and uglifyjs-webpack-plugin.
Use a Content Delivery Network (CDN): A Content Delivery Network (CDN) is a network of servers that are distributed across the globe. By using a CDN, your application's assets will be served from a server that is geographically closer to the user, resulting in faster load times.
Use the bundle analyzer: The webpack bundle analyzer is a tool that allows you to visualize the size and contents of your bundle. This can help you identify which modules and dependencies are taking up the most space and make decisions about which to remove or replace.
Use lazy loading: Lazy loading is a technique where you only load the code that is needed for a particular page or feature when it is requested by the user. This can be done using the react-lazy and react-loadable libraries for React applications.
Use production mode: By default, webpack runs in development mode, which includes additional debugging and development-related features. Running webpack in production mode will automatically turn off development-specific features and enable production-specific optimizations.
Use caching: Enabling caching allows webpack to store the build results and reuse them on subsequent builds. This can significantly speed up the build time. To enable caching you can use cache-loader or hard-source-webpack-plugin.
Use environment variables: Instead of hardcoding values in your code, you can use environment variables to store values that may change between environments, such as an API endpoint or a feature flag.

By following these techniques, you can significantly reduce the size and improve the performance of your webpack project, resulting in a better user experience for your application. Remember that webpack optimization is an ongoing process, you should regularly monitor your bundle size and make adjustments as necessary.

Forem: Loránd Márton

Just start using WSL

Introduction

Get an awesome tool: WSL

References

Optimizing a Webpack project to improve the performance and user experience