Radar has landed - discover the latest DDoS attack trends. Get ahead, stay protected.Get the report
Under attack?

Products

Solutions

Resources

Partners

Why Gcore

  1. Home
  2. Developers
  3. Jenkins Pipeline with Sonarqube and Gitlab

Jenkins Pipeline with Sonarqube and Gitlab

  • By Gcore
  • April 2, 2023
  • 5 min read
Jenkins Pipeline with Sonarqube and Gitlab

In this guide, we are going to deploy a continuous integration process between Jenkins, GitLab, and SonarQube.

The end goal will be to review the code quality through SonarQube for GitLab repository using Jenkins. Following is the process flow we need to manage:

  • Push code to GitLab from the local machine.
  • Next, checkout code and run tests in Jenkins, here it is acting as a Continuous Integrator.
  • Generate quality report via SonarQube as a code analyser.

Setup Jenkins, SonarQube & GitLabs

In case, if you haven’t set up the required software yet, go through the below-mentioned steps:

Step 1:

Make sure that your host machine has enough power to run these components, as GitLab alone requires 4 GB of RAM to perform its operations smoothly. To run all three together, you need at least 8 GB of RAM and 20 GB of hard disk space.

Step 2:

For SonarQube, you need to set the recommended values as a root user on the host machine:

$ sysctl -w vm.max_map_count=262144$ sysctl -w fs.file-max=65536$ ulimit -n 65536$ ulimit -u 4096

Step 3:

For this guide, we are going to use a simple docker-compose.yml file. However, you are free to edit the file as per your requirement.

Before launching the containers, please make sure that you change the value of GITLAB_SECRETS_DB_KEY_BASE, GITLAB_HOST, SONARQUBE_JDBC_PASSWORD, and POSTGRES_PASSWORD. Although, along with this, you can also modify the define ports in the file.

version: "3.2" services:   jenkins:       image: jenkinsci/jenkins:lts       container_name: jenkins-container       restart: always       ports:           - "8080:8080"           - '50000:50000'       volumes:       - '/var/run/docker.sock:/var/run/docker.sock'       - '/data/jenkins/jenkins_home:/var/jenkins_home'       environment:       - "JENKINS_OPTS=--prefix=/jenkins"    gitlab:       image: gitlab/gitlab-ce:latest       container_name: gitlab-container       restart: always       environment:           - GITLAB_SECRETS_DB_KEY_BASE=long-and-random-alphanumeric-string           - GITLAB_HOST=your-host-ip-here           - GITLAB_PORT=10080           - GITLAB_SSH_PORT=10022       ports:           - "10080:80"           - "10022:22"       volumes:       - '/data/gitlab/config:/etc/gitlab'       - '/data/gitlab/logs:/var/log/gitlab'       - '/data/gitlab/data:/var/opt/gitlab'    sonarqube:       image: sonarqube:7.9.2-community       container_name: sonar-container       restart: always       networks:           - sonarnet       environment:           - SONARQUBE_JDBC_USERNAME=sonar           - SONARQUBE_JDBC_PASSWORD=your-strong-password-here           - SONARQUBE_JDBC_URL=jdbc:postgresql://postgressdb:5432/sonarqube       ports:       - "9000:9000"       - "9092:9092"       volumes:       - '/data/sonar/sonarqube_conf:/opt/sonarqube/conf'       - '/data/sonar/sonarqube_data:/opt/sonarqube/data'       - '/data/sonar/sonarqube_extensions:/opt/sonarqube/extensions'       - '/data/sonar/sonarqube_bundled-plugins:/opt/sonarqube/lib/bundled-plugins'     postgressdb:       image: postgres:12.1       container_name: postgres-container       restart: always       networks:           - sonarnet       environment:           - POSTGRES_USER=sonar           - POSTGRES_PASSWORD=your-strong-password-here           - POSTGRES_DB=sonarqube       volumes:       - '/data/postgresql/sonarqube_db:/var/lib/postgresql'       - '/data/postgresql/postgresql_data:/var/lib/postgresql/data' networks:   sonarnet:    driver: bridge

Now, run the following command to launch the stack:

$ docker-compose up -d

Note that the installation process is going to take some time, so sit back and have some coffee. You deserve it!

Step 4:

Now, to verify if all systems are up and running, run this command:

$ docker psCONTAINER ID    IMAGE                     COMMAND             CREATED         STATUS                  PORTS                                                   NAMESf54e223417fa    gitlab/gitlab-ce:latest   "/assets/wrapper"   1 minute ago    1 minute ago (healthy)  443/tcp, 0.0.0.0:10022->22/tcp, 0.0.0.0:10080->80/tcp   gitlab-container9102f03f69b8    sonarqube                 "./bin/run.sh"      1 minute ago    1 minute ago            0.0.0.0:9000->9000/tcp                                  sonar-container05f554da39fc    jenkinsci/jenkins:lts     "/bin/tini --..."   1 minute ago    1 minute ago            0.0.0.0:8080->8080/tcp, 0.0.0.0:50000->50000/tcp        jenkins-container

If all went well, then you can access all three of them by following mentioned URLs:

As you are visiting your Jenkins environment for the first time, it is going to prompt you to enter the administrator password, which was generated during the installation process. To access the password from the container, you can run the following command:

$ docker exec -it <your-jinkins-container-id> cat /var/jenkins_home/secrets/initialAdminPassword$ gSzHTGfbtXSpcBXMyJ6gzmNfNH7BjhK23

Once you enter the password, you can select the option Install suggested plugin. Wait until the download finishes.

For SonarQube, the default username and password are admin and admin, respectively. Whereas, for GitLab, you will be prompted to enter the new password for the default username root.

Configuring Jenkins Pipeline with SonarQube and GitLab integration

SonarQube Configuration:
We will begin with SonarQube. To connect it with Jenkins, you need to generate the token to access the SonarQube instance.

Login into the SonarQube dashboard and go to the Administrator tab. In the Security drop-down menu, select User tab as shown in the below image:

Here you will find Administrator user, for which you are going to generate the access token:

In the pop-up that displays on your screen, enter the desired name and click on the Generate button. Copy the newly generated token and save it somewhere safe, as you won’t be able to view/copy the generated token again.

GitLab Configuration:
To establish a connection between GitLab and Jenkins, again, we need to generate an access token, which can be done as mentioned below:

To generate an access token, go to your GitLab dashboard and follow Dashboard > Setting > Access Tokens. Once you have the token with you, copy it for further use.

Integrating SonarQube and GitLabs in Jenkins:
This guide assumes that you have already done the basic setup for Jenkins. Now, let’s move to configure GitLab and SonarQube in the Jenkins server.

First, we are going to integrate SonarQube. Go Dashboard > Manage Jenkins > Manage Plugins and search for SonarQube.

Make sure you restart Jenkins once the plugin is successfully installed.

Once the restart is completed, you have to set up Sonar Scanner, which is a standalone tool used for scanning the source code and send the result to SonarQube Server. Here you are going to install it in the Jenkins container itself, although you are free to launch a separate container for the same purpose.

$ docker exec -it <your-jinkins-container-id> bash$ cd /var/jenkins_home$ wget https://binaries.sonarsource.com/Distribution/sonar-scanner-cli/sonar-scanner-cli-4.2.0.1873-linux.zip$ unzip sonar-scanner-cli-4.2.0.1873-linux.zip

Go back to the Manage Jenkins page and select Global Tool Configuration.

In this page, find SonarQube Scanner and add complete the installation:

Don’t forget to uncheck Install automatically as you have to define the installation path of Sonar Scanner explicitly.

As Jenkins and SonarQube are running in separate docker containers, we need to create a Webhook at SonarQube Server so that both can communicate with each other. To do so, follow Dashboard > Administrator > Configuration > Webhook:

Lastly, you have to add the access token you generated on your SonarQube server in Jenkins. Follow the URL http://your-ip-addr-here:8080/credentials/store/system/ or go to Dashboard > Credentials > System, as shown below:

Click on Add Credentials link and select “Secret Text” field under Kind:

In the Secret field, paste the generated token from SonarQube that you previously created.

Now, add the SonarQube server to your Jenkins environment. Go to Dashboard > Manage Jenkins > Configure System. Find SonarQube server on the page and add the required details as mentioned below:

Now, you have to add Gitlab in Jenkins, visit Dashboard > Credentials > System. Here, you are going to add the access token you previously created to your Jenkins server. Although, you can also use Kind with username and password.

As you are through with the SonarQube and GitLab integration in Jenkins, it’s time to manage other dependencies. In this guide, we are going to use a simple NodeJs application; hence it’s time to install NodeJS on your Jenkins Server.

NodeJS Environment in Jenkins:

To install NodeJS plugin, go to Dashboard > Manage Jenkins > Manage Plugins > Available and search and select NodeJS. Click on the Install without restart button, as shown in the figure below.

Upon successful installation of NodeJS plugin in Jenkins, make sure that you restart Jenkins.

To configure NodeJS plugin, go to Dashboard > Manage Jenkins > Global Tool Configuration and find “NodeJS”. Click on NodeJS installation button and add the necessary details, as shown in the figure:

Give a name and select the NodeJS version as per your requirement; you can also install Global NPM packages and set the refresh rate depending upon the project requirements.

Once done, you need to save the configuration. As we are through with the gruesome part of installing and configuring the environment, it’s time to create the project pipeline.

Creating Jenkins Pipeline

Here you are going to create a pipeline using Declarative Scripted Pipeline. Follow the below steps to get started:

Step 1: Create a New Job
Go to Jenkins’ Dashboard and click on the “New Item” link. Now, enter the item name and select Pipeline option as shown in the figure:

Step 2: Pipeline
The below-mentioned simple pipeline script helps you to pull the code from GitLab, quality check via SonarQube, and use NodeJS.

pipeline {agent anytools {nodejs "nodenv"}stages { stage("Code Checkout from GitLab") {  steps {   git branch: 'master',    credentialsId: 'gitlab_access_token',    url: 'http://your-ip-here:10080/root/test-project.git'  } }   stage('Code Quality Check via SonarQube') {   steps {       script {       def scannerHome = tool 'sonarqube';           withSonarQubeEnv("sonarqube-container") {           sh "${tool("sonarqube")}/bin/sonar-scanner \           -Dsonar.projectKey=test-node-js \           -Dsonar.sources=. \           -Dsonar.css.node=. \           -Dsonar.host.url=http://your-ip-here:9000 \           -Dsonar.login=your-generated-token-from-sonarqube-container"               }           }       }   }   stage("Install Project Dependencies") {   steps {       nodejs(nodeJSInstallationName: 'nodenv'){           sh "npm install"           }       }   }}}

Make sure that you change the values of GitLab repo URL, SonarQube host URL, and its access token.

Add the above-mentioned pipeline script and save it, as shown in the below figure:

Step 3: Run Pipeline
Now, as you have saved the pipeline script, it’s time to build your application in Jenkins. Go to Dashboard > YOUR PROJECT > Build Now.

As soon as you click the Build Now link, Jenkins will start building project as per pipeline script. In Build History, you will see the progress bar for the current build along with the Stage View:

If your build runs successfully, you will be able to see the time taken by each stage, in Stage View:

Also, you can visit the SonarQube dashboard to see the project code report, by visiting the link named as “SonarQube” on project pipeline page.

That’s it! You have successfully created a Jenkins Pipeline while using SonarQube and GitLab. Now, every time you push the code to the repo, you can build the project, which will show the code quality.

Explore Gcore Container as a Service

Related articles

Optimize your workload: a guide to selecting the best virtual machine configuration

Virtual machines (VMs) offer the flexibility, scalability, and cost-efficiency that businesses need to optimize workloads. However, choosing the wrong setup can lead to poor performance, wasted resources, and unnecessary costs.In this guide, we’ll walk you through the essential factors to consider when selecting the best virtual machine configuration for your specific workload needs.﹟1 Understand your workload requirementsThe first step in choosing the right virtual machine configuration is understanding the nature of your workload. Workloads can range from light, everyday tasks to resource-intensive applications. When making your decision, consider the following:Compute-intensive workloads: Applications like video rendering, scientific simulations, and data analysis require a higher number of CPU cores. Opt for VMs with multiple processors or CPUs for smoother performance.Memory-intensive workloads: Databases, big data analytics, and high-performance computing (HPC) jobs often need more RAM. Choose a VM configuration that provides sufficient memory to avoid memory bottlenecks.Storage-intensive workloads: If your workload relies heavily on storage, such as file servers or applications requiring frequent read/write operations, prioritize VM configurations that offer high-speed storage options, such as SSDs or NVMe.I/O-intensive workloads: Applications that require frequent network or disk I/O, such as cloud services and distributed applications, benefit from VMs with high-bandwidth and low-latency network interfaces.﹟2 Consider VM size and scalabilityOnce you understand your workload’s requirements, the next step is to choose the right VM size. VM sizes are typically categorized by the amount of CPU, memory, and storage they offer.Start with a baseline: Select a VM configuration that offers a balanced ratio of CPU, RAM, and storage based on your workload type.Scalability: Choose a VM size that allows you to easily scale up or down as your needs change. Many cloud providers offer auto-scaling capabilities that adjust your VM’s resources based on real-time demand, providing flexibility and cost savings.Overprovisioning vs. underprovisioning: Avoid overprovisioning (allocating excessive resources) unless your workload demands peak capacity at all times, as this can lead to unnecessary costs. Similarly, underprovisioning can affect performance, so finding the right balance is essential.﹟3 Evaluate CPU and memory considerationsThe central processing unit (CPU) and memory (RAM) are the heart of a virtual machine. The configuration of both plays a significant role in performance. Workloads that need high processing power, such as video encoding, machine learning, or simulations, will benefit from VMs with multiple CPU cores. However, be mindful of CPU architecture—look for VMs that offer the latest processors (e.g., Intel Xeon, AMD EPYC) for better performance per core.It’s also important that the VM has enough memory to avoid paging, which occurs when the system uses disk space as virtual memory, significantly slowing down performance. Consider a configuration with more RAM and support for faster memory types like DDR4 for memory-heavy applications.﹟4 Assess storage performance and capacityStorage performance and capacity can significantly impact the performance of your virtual machine, especially for applications requiring large data volumes. Key considerations include:Disk type: For faster read/write operations, opt for solid-state drives (SSDs) over traditional hard disk drives (HDDs). Some cloud providers also offer NVMe storage, which can provide even greater speed for highly demanding workloads.Disk size: Choose the right size based on the amount of data you need to store and process. Over-allocating storage space might seem like a safe bet, but it can also increase costs unnecessarily. You can always resize disks later, so avoid over-allocating them upfront.IOPS and throughput: Some workloads require high input/output operations per second (IOPS). If this is a priority for your workload (e.g., databases), make sure that your VM configuration includes high IOPS storage options.﹟5 Weigh up your network requirementsWhen working with cloud-based VMs, network performance is a critical consideration. High-speed and low-latency networking can make a difference for applications such as online gaming, video conferencing, and real-time analytics.Bandwidth: Check whether the VM configuration offers the necessary bandwidth for your workload. For applications that handle large data transfers, such as cloud backup or file servers, make sure that the network interface provides high throughput.Network latency: Low latency is crucial for applications where real-time performance is key (e.g., trading systems, gaming). Choose VMs with low-latency networking options to minimize delays and improve the user experience.Network isolation and security: Check if your VM configuration provides the necessary network isolation and security features, especially when handling sensitive data or operating in multi-tenant environments.﹟6 Factor in cost considerationsWhile it’s essential that your VM has the right configuration, cost is always an important factor to consider. Cloud providers typically charge based on the resources allocated, so optimizing for cost efficiency can significantly impact your budget.Consider whether a pay-as-you-go or reserved model (which offers discounted rates in exchange for a long-term commitment) fits your usage pattern. The reserved option can provide significant savings if your workload runs continuously. You can also use monitoring tools to track your VM’s performance and resource usage over time. This data will help you make informed decisions about scaling up or down so you’re not paying for unused resources.﹟7 Evaluate security featuresSecurity is a primary concern when selecting a VM configuration, especially for workloads handling sensitive data. Consider the following:Built-in security: Look for VMs that offer integrated security features such as DDoS protection, web application firewall (WAF), and encryption.Compliance: Check that the VM configuration meets industry standards and regulations, such as GDPR, ISO 27001, and PCI DSS.Network security: Evaluate the VM's network isolation capabilities and the availability of cloud firewalls to manage incoming and outgoing traffic.﹟8 Consider geographic locationThe geographic location of your VM can impact latency and compliance. Therefore, it’s a good idea to choose VM locations that are geographically close to your end users to minimize latency and improve performance. In addition, it’s essential to select VM locations that comply with local data sovereignty laws and regulations.﹟9 Assess backup and recovery optionsBackup and recovery are critical for maintaining data integrity and availability. Look for VMs that offer automated backup solutions so that data is regularly saved. You should also evaluate disaster recovery capabilities, including the ability to quickly restore data and applications in case of failure.﹟10 Test and iterateFinally, once you've chosen a VM configuration, testing its performance under real-world conditions is essential. Most cloud providers offer performance monitoring tools that allow you to assess how well your VM is meeting your workload requirements.If you notice any performance bottlenecks, be prepared to adjust the configuration. This could involve increasing CPU cores, adding more memory, or upgrading storage. Regular testing and fine-tuning means that your VM is always optimized.Choosing a virtual machine that suits your requirementsSelecting the best virtual machine configuration is a key step toward optimizing your workloads efficiently, cost-effectively, and without unnecessary performance bottlenecks. By understanding your workload’s needs, considering factors like CPU, memory, storage, and network performance, and continuously monitoring resource usage, you can make informed decisions that lead to better outcomes and savings.Whether you're running a small application or large-scale enterprise software, the right VM configuration can significantly improve performance and cost. Gcore offers a wide range of virtual machine options that can meet your unique requirements. Our virtual machines are designed to meet diverse workload requirements, providing dedicated vCPUs, high-speed storage, and low-latency networking across 30+ global regions. You can scale compute resources on demand, benefit from free egress traffic, and enjoy flexible pricing models by paying only for the resources in use, maximizing the value of your cloud investments.Contact us to discuss your VM needs

How to get the size of a directory in Linux

Understanding how to check directory size in Linux is critical for managing storage space efficiently. Understanding this process is essential whether you’re assessing specific folder space or preventing storage issues.This comprehensive guide covers commands and tools so you can easily calculate and analyze directory sizes in a Linux environment. We will guide you step-by-step through three methods: du, ncdu, and ls -la. They’re all effective and each offers different benefits.What is a Linux directory?A Linux directory is a special type of file that functions as a container for storing files and subdirectories. It plays a key role in organizing the Linux file system by creating a hierarchical structure. This arrangement simplifies file management, making it easier to locate, access, and organize related files. Directories are fundamental components that help ensure smooth system operations by maintaining order and facilitating seamless file access in Linux environments.#1 Get Linux directory size using the du commandUsing the du command, you can easily determine a directory’s size by displaying the disk space used by files and directories. The output can be customized to be presented in human-readable formats like kilobytes (KB), megabytes (MB), or gigabytes (GB).Check the size of a specific directory in LinuxTo get the size of a specific directory, open your terminal and type the following command:du -sh /path/to/directoryIn this command, replace /path/to/directory with the actual path of the directory you want to assess. The -s flag stands for “summary” and will only display the total size of the specified directory. The -h flag makes the output human-readable, showing sizes in a more understandable format.Example: Here, we used the path /home/ubuntu/, where ubuntu is the name of our username directory. We used the du command to retrieve an output of 32K for this directory, indicating a size of 32 KB.Check the size of all directories in LinuxTo get the size of all files and directories within the current directory, use the following command:sudo du -h /path/to/directoryExample: In this instance, we again used the path /home/ubuntu/, with ubuntu representing our username directory. Using the command du -h, we obtained an output listing all files and directories within that particular path.#2 Get Linux directory size using ncduIf you’re looking for a more interactive and feature-rich approach to exploring directory sizes, consider using the ncdu (NCurses Disk Usage) tool. ncdu provides a visual representation of disk usage and allows you to navigate through directories, view size details, and identify large files with ease.For Debian or Ubuntu, use this command:sudo apt-get install ncduOnce installed, run ncdu followed by the path to the directory you want to analyze:ncdu /path/to/directoryThis will launch the ncdu interface, which shows a breakdown of file and subdirectory sizes. Use the arrow keys to navigate and explore various folders, and press q to exit the tool.Example: Here’s a sample output of using the ncdu command to analyze the home directory. Simply enter the ncdu command and press Enter. The displayed output will look something like this:#3 Get Linux directory size using 1s -1aYou can alternatively opt to use the ls command to list the files and directories within a directory. The options -l and -a modify the default behavior of ls as follows:-l (long listing format)Displays the detailed information for each file and directoryShows file permissions, the number of links, owner, group, file size, the timestamp of the last modification, and the file/directory name-a (all files)Instructs ls to include all files, including hidden files and directoriesIncludes hidden files on Linux that typically have names beginning with a . (dot)ls -la lists all files (including hidden ones) in long format, providing detailed information such as permissions, owner, group, size, and last modification time. This command is especially useful when you want to inspect file attributes or see hidden files and directories.Example: When you enter ls -la command and press Enter, you will see an output similar to this:Each line includes:File type and permissions (e.g., drwxr-xr-x):The first character indicates the file type- for a regular filed for a directoryl for a symbolic linkThe next nine characters are permissions in groups of three (rwx):r = readw = writex = executePermissions are shown for three classes of users: owner, group, and others.Number of links (e.g., 2):For regular files, this usually indicates the number of hard linksFor directories, it often reflects subdirectory links (e.g., the . and .. entries)Owner and group (e.g., user group)File size (e.g., 4096 or 1045 bytes)Modification date and time (e.g., Jan 7 09:34)File name (e.g., .bashrc, notes.txt, Documents):Files or directories that begin with a dot (.) are hidden (e.g., .bashrc)ConclusionThat’s it! You can now determine the size of a directory in Linux. Measuring directory sizes is a crucial skill for efficient storage management. Whether you choose the straightforward du command, use the visual advantages of the ncdu tool, or opt for the versatility of ls -la, this expertise enhances your ability to uphold an organized and efficient Linux environment.Looking to deploy Linux in the cloud? With Gcore Edge Cloud, you can choose from a wide range of pre-configured virtual machines suitable for Linux:Affordable shared compute resources starting from €3.2 per monthDeploy across 50+ cloud regions with dedicated servers for low-latency applicationsSecure apps and data with DDoS protection, WAF, and encryption at no additional costGet started today

How to Run Hugging Face Spaces on Gcore Inference at the Edge

Running machine learning models, especially large-scale models like GPT 3 or BERT, requires a lot of computing power and comes with a lot of latency. This makes real-time applications resource-intensive and challenging to deliver. Running ML models at the edge is a lightweight approach offering significant advantages for latency, privacy, and resource optimization.  Gcore Inference at the Edge makes it simple to deploy and manage custom models efficiently, giving you the ability to deploy and scale your favorite Hugging Face models globally in just a few clicks. In this guide, we’ll walk you through how easy it is to harness the power of Gcore’s edge AI infrastructure to deploy a Hugging Face Space model. Whether you’re developing NLP solutions or cutting-edge computer vision applications, deploying at the edge has never been simpler—or more powerful. Step 1: Log In to the Gcore Customer PortalGo to gcore.com and log in to the Gcore Customer Portal. If you don’t yet have an account, go ahead and create one—it’s free. Step 2: Go to Inference at the EdgeIn the Gcore Customer Portal, click Inference at the Edge from the left navigation menu. Then click Deploy custom model. Step 3: Choose a Hugging Face ModelOpen huggingface.com and browse the available models. Select the model you want to deploy. Navigate to the corresponding Hugging Face Space for the model. Click on Files in the Space and locate the Docker option. Copy the Docker image link and startup command from Hugging Face Space. Step 4: Deploy the Model on GcoreReturn to the Gcore Customer Portal deployment page and enter the following details: Model image URL: registry.hf.space/ethux-mistral-pixtral-demo:latest Startup command: python app.py Container port: 7860 Configure the pod as follows: GPU-optimized: 1x L40S vCPUs: 16 RAM: 232GiB For optimal performance, choose any available region for routing placement. Name your deployment and click Deploy.Step 5: Interact with Your ModelOnce the model is up and running, you’ll be provided with an endpoint. You can now interact with the model via this endpoint to test and use your deployed model at the edge.Powerful, Simple AI Deployment with GcoreGcore Inference at the Edge is the future of AI deployment, combining the ease of Hugging Face integration with the robust infrastructure needed for real-time, scalable, and global solutions. By leveraging edge computing, you can optimize model performance and simultaneously futureproof your business in a world that increasingly demands fast, secure, and localized AI applications. Deploying models to the edge allows you to capitalize on real-time insights, improve customer experiences, and outpace your competitors. Whether you’re leading a team of developers or spearheading a new AI initiative, Gcore Inference at the Edge offers the tools you need to innovate at the speed of tomorrow. Explore Gcore Inference at the Edge

10 Common Web Performance Mistakes and How to Overcome Them

Web performance mistakes can carry a high price, resulting in websites that yield low conversion rates, high bounce rates, and poor sales. In this article, we dig into the top 10 mistakes you should avoid to boost your website performance.1. Slow or Unreliable Web HostYour site speed begins with your web host, which provides the server infrastructure and resources for your website. This includes the VMs and other infrastructure where your code and media files reside. Three common host-related problems are as follows:Server location: The further away your server is from your users, the slower the site speed and the poorer the experience for your website visitors. (More on this under point 7.)Shared hosting: Shared hosting solutions share server resources among multiple websites, leading to slow load times and spotty connections during peak times due to heavy usage. Shared VMs can also impact your website’s performance due to increased network traffic and resource contention.VPS hosting: Bandwidth limitations can be a significant issue with VPS hosting. A limited bandwidth package can cause your site speed to decrease during high-traffic periods, resulting in a sluggish user experience.Correct for server and VM hosting issues by choosing a provider with servers located closer to your user base and provisioning sufficient computational resources, like Gcore CDN. Use virtual dedicated servers (VDS/VPS) rather than shared hosting to avoid network traffic from other websites affecting your site’s performance. If you already use a VPS, consider upgrading your hosting plan to increase server resources and improve UX. For enterprises, dedicated servers may be more suitable.2. Inefficient Code, Libraries, and FrameworksPoor-quality code and inefficient frameworks can increase the size of web pages, consume too many resources, and slow down page load times. Code quality is often affected by syntax, semantics, and logic errors. Correct these issues by writing clean and simple code.Errors or inefficiencies introduced by developers can impact site performance, such as excessive API calls or memory overuse. Prevent these issues by using TypeScript, console.log, or built-in browser debuggers during development. For bugs in already shipped code, utilize logging and debugging tools like the GNU debugger or WinDbg to identify and resolve problems.Improving code quality also involves minimizing the use of large libraries and frameworks. While frontend frameworks like React, Vue, and Angular.js are popular for accelerating development, they often include extensive JavaScript and prebuilt components that can bloat your website’s codebase. To optimize for speed, carefully analyze your use case to determine if a framework is necessary. If a static page suffices, avoid using a framework altogether. If a framework is needed, select libraries that allow you to link only the required components.3. Unoptimized Code Files and FontsEven high-quality code needs optimization before shipping. Unoptimized JavaScript, HTML, and CSS files can increase page weight and necessitate multiple HTTP requests, especially if JavaScript files are executed individually.To optimize code, two effective techniques are minification and bundling.Minification removes redundant libraries, code, comments, unnecessary characters (e.g., commas and dots), and formatting to reduce your source code’s size. It also shortens variable and function names, further decreasing file size. Tools for minification include UglifyJS for JavaScript, CSSNano for CSS, and HTMLminifier for HTML.Bundling groups multiple files into one, reducing the number of HTTP requests and speeding up site load times. Popular bundling tools include Rollup, Webpack, and Parcel.File compression using GZIP or Brotli can also reduce the weight of HTTP requests and responses before they reach users’ browsers. Enable your chosen compression technique on your server only after checking that your server provider supports it.4. Unoptimized Images and VideosSome websites are slowed down by large media files. Upload only essential media files to your site. For images, compress or resize them using tools like TinyPNG and Compressor.io. Convert images from JPEG, PNG, and GIF to WebP and AVIF formats to maintain quality while reducing file size. This is especially beneficial in industries like e-commerce and travel, where multiple images boost conversion rates. Use dynamic image optimization services like Gcore Image Stack for efficient processing and delivery. For pages with multiple images, use CSS sprites to group them, reducing the number of HTTP requests and speeding up load times.When adding video files, use lite embeds for external links. Standard embed code, like YouTube’s, is heavy and can slow down your pages. Lite embeds load only thumbnail images initially, and the full video loads when users click the thumbnail, improving page speed.5. No Lazy LoadingLazy loading delays the rendering of heavy content like images and JavaScript files until the user needs it, contrasting with “eager” loading, which loads everything at once and slows down site load times. Even with optimized images and code, lazy loading can further enhance site speed through a process called “timing.”Image timing uses the HTML loading attribute in an image tag or frameworks like Angular or React to load images in response to user actions. The browser only requests images when the user interacts with specific features, triggering the download.JavaScript timing controls when certain code loads. If JavaScript doesn’t need to run until the entire page has rendered, use the defer attribute to delay its execution. If JavaScript can load at any time without affecting functionality, load it asynchronously with the async attribute.6. Heavy or Redundant External Widgets and PluginsWidgets and plugins are placed in designated frontend and backend locations to extend website functionality. Examples include Google review widgets that publish product reviews on your website and Facebook plugins that connect your website to your Facebook Page. As your website evolves, more plugins are typically installed, and sometimes website admins forget to remove those that are no longer required.Over time, heavy and unused plugins can consume substantial resources, slowing down your website unnecessarily. Widgets may also contain heavy HTML, CSS, or JavaScript files that hinder web performance.Remove unnecessary plugins and widgets, particularly those that make cURL calls, HTTP requests, or generate excessive database queries. Avoid plugins that load heavy scripts and styles or come from unreliable sources, as they may contain malicious code and degrade website performance.7. Network IssuesYour server’s physical location significantly impacts site speed for end users. For example, if your server is in the UK and your users are in China, they’ll experience high latency due to the distance and DNS resolution time. The greater the distance between the server and the user, the more network hops are required, increasing latency and slowing down site load times.DNS resolution plays a crucial role in this process. Your authoritative DNS provider resolves your domain name to your IP address. If the provider’s server is too far from the user, DNS resolution will be slow, giving visitors a poor first impression.To optimize content delivery and reduce latency, consider integrating a content delivery network (CDN) with your server-side code. A CDN stores copies of your static assets (e.g., container images, JavaScript, CSS, and HTML files) on geographically distributed servers. This distribution ensures that users can access your content from a server closer to their location, significantly improving site speed and performance.8. No CachingWithout caching, your website has to fetch data from the origin server every time a user requests. This increases the load time because the origin server is another physical hop that data has to travel.Caching helps solve this problem by serving pre-saved copies of your website. Copies of your web files are stored on distributed CDN servers, meaning they’re available physically closer to website viewers, resulting in quicker load times.An additional type of caching, DNS caching, temporarily stores DNS records in DNS resolvers. This allows for faster domain name resolution and accelerates the initial connection to a website.9. Excessive RedirectsWebsite redirects send users from one URL to another, often resulting in increased HTTP requests to servers. These additional requests can potentially crash servers or cause resource consumption issues. To prevent this, use tools like Screaming Frog to scan your website for redirects and reduce them to only those that are absolutely necessary. Additionally, limit each redirect to making no more than one request for a .css file and one for a .js file.10. Lack of Mobile OptimizationForgetting to optimize for mobile can harm your website’s performance. Mobile-first websites optimize for speed and UX. Better UX leads to happier customers and increased sales.Optimizing for mobile starts with understanding the CPU, bandwidth, and memory limitations of mobile devices compared to desktops. Sites with excessively heavy files will load slowly on mobiles. Writing mobile-first code, using mobile devices or emulators for building and testing, and enhancing UX for various mobile device types—such as those with larger screens or higher capacity—can go a long way to optimizing for mobile.How Can Gcore Help Prevent These Web Performance Mistakes?If you’re unsure where to start in correcting or preventing web performance mistakes, don’t worry—you don’t have to do it alone. Gcore offers a comprehensive suite of solutions designed to enhance your web performance and deliver the best user experience for your visitors:Powerful VMs: Fast web hosting with a wide range of virtual machines.Managed DNS: Hosting your DNS zones and ensuring quick DNS resolution with our fast Managed DNS.CDN: Accelerate both static and dynamic components of your website for global audiences.With robust infrastructure from Gcore, you can ensure optimal performance and a seamless experience for all your web visitors. Keep your website infrastructure in one place for a simplified website management experience.Need help getting started? Contact us for a personalized consultation and discover how Gcore can supercharge your website performance.Get in touch to boost your website

How to Choose Between Bare Metal GPUs and Virtual GPUs for AI Workloads

Choosing the right GPU type for your AI project can make a huge difference in cost and business outcomes. The first consideration is often whether you need a bare metal or virtual GPU. With a bare metal GPU, you get a physical server with an entire GPU chip (or chips) installed that is completely dedicated to the workloads you run on the server, whereas a virtual GPU means you share GPU resources with other virtual machines.Read on to discover the key differences between bare metal GPUs and virtual GPUs, including performance and scalability, to help you make an informed decision.The Difference Between Bare Metal and Virtual GPUsThe main difference between bare metal GPUs and virtual GPUs is how they use physical GPU resources. With a bare metal GPU, you get a physical server with an entire GPU chip (or chips) installed that is completely dedicated to the workloads you run on the server. There is no hypervisor layer between the operating system (OS) and the hardware, so applications use the GPU resources directly.With a virtual GPU, you get a virtual machine (VM) and uses one of two types of GPU virtualization, depending on your or a cloud provider’s capabilities:An entire, dedicated GPU used by a VM, also known as a passthrough GPUA shared GPU used by multiple VMs, also known as a vGPUAlthough a passthrough GPU VM gets the entire GPU, applications access it through the layers of a guest OS and hypervisor. Also, unlike a bare metal GPU instance, other critical VM resources that applications use, such as RAM, storage, and networking, are also virtualized.The difference between running applications with bare metal and virtual GPUsThese architectural features affect the following key aspects:Performance and latency: Applications running on a VM with a virtual GPU, especially vGPU, will have lower processing power and higher latency for the same GPU characteristics than those running on bare metal with a physical GPU.Cost: As a result of the above, bare metal GPUs are more expensive than virtual GPUs.Scalability: Virtual GPUs are easier to scale than bare metal GPUs because scaling the latter requires a new physical server. In contrast, a new GPU instance can be provisioned in the cloud in minutes or even seconds.Control over GPU hardware: This can be critical for certain configurations and optimizations. For example, when training massive deep learning models with a billion parameters, total control means the ability to optimize performance optimization—and that can have a big impact on training efficiency for massive datasets.Resource utilization: GPU virtualization can lead to underutilization if the tasks being performed don’t need the full power of the GPU, resulting in wasted resources.Below is a table summarizing the benefits and drawbacks of each approach: Bare metal GPUVirtual GPUPassthrough GPUvGPUBenefitsDedicated GPU resourcesHigh performance for demanding AI workloadsLower costSimple scalabilitySuitable for occasional or variable workloadsLowest costSimple scalabilitySuitable for occasional or variable workloadsDrawbacksHigh cost compared to virtual GPUsLess flexible and scalable than virtual GPUsLow performanceNot suitable for demanding AI workloadsLowest performanceNot suitable for demanding AI workloadsShould You Use Bare Metal or Virtual GPUs?Bare metal GPUs and virtual GPUs are typically used for different types of workloads. Your choice will depend on what AI tasks you’re looking to perform.Bare metal GPUs are better suited for compute-intensive AI workloads that require maximum performance and speed, such as training large language models. They are also a good choice for workloads that must run 24/7 without interruption, such as some production AI inference services. Finally, bare metal GPUs are preferred for real-time AI tasks, such as robotic surgery or high-frequency trading analytics.Virtual GPUs are a more suitable choice for the early stages of AI/ML and iteration on AI models, where flexibility and cost-effectiveness are more important than top performance. Workloads with variable or unpredictable resource requirements can also run on this type of GPU, such as training and fine-tuning small models or AI inference tasks that are not sensitive to latency and performance. Virtual GPUs are also great for occasional, short-term, and collaborative AI/ML projects that don’t require dedicated hardware—for example, an academic collaboration that includes multiple institutions.To choose the right type of GPU, consider these three factors:Performance requirements. Is the raw GPU speed critical for your AI workloads? If so, bare metal GPUs are a superior choice.Scalability and flexibility. Do you need GPUs that can easily scale up and down to handle dynamic workloads? If yes, opt for virtual GPUs.Budget. Depending on the cloud provider, bare metal GPU servers can be more expensive than virtual GPU instances. Virtual GPUs typically offer more flexible pricing, which may be appropriate for occasional or variable workloads.Your final choice between bare metal GPUs and virtual GPUs depends on the specific requirements of the AI/ML project, including performance needs, scalability requirements, workload types, and budget constraints. Evaluating these factors can help determine the most appropriate GPU option.Choose Gcore for Best-in-Class AI GPUsGcore offers bare metal servers with NVIDIA H100, A100, and L40S GPUs. Using the 3.2 Tbps InfiniBand interface, you can combine H100 or A100 servers into scalable GPU clusters for training and tuning massive ML models or for high-performance computing (HPC).If you are looking for a scalable and low-latency solution for global AI inference, explore Gcore Inference at the Edge. It especially benefits latency-sensitive, real-time applications, such as generative AI and object recognition.Discover Gcore bare metal GPUs

How to Configure Grafana for Visualizing Kubernetes (K8s) Cluster Monitoring

Kubernetes monitoring allows you to observe your workloads and cluster resources, spot issues and failures, and efficiently manage pods and other resources. Cluster admins should prioritize tracking the performance and stability of clusters in these environments. One popular tool that can help you visualize Kubernetes monitoring is Grafana. This monitoring solution lets you display K8s metrics through interactive dashboards and real-time alerts. It seamlessly integrates with Prometheus and other data sources, providing valuable insights.Gcore Managed Kubernetes simplifies the Grafana setup process by providing a managed service that includes tools like Grafana. In this article, we’ll explain how to set up and configure Grafana to monitor Kubernetes, its key metrics, and dashboards.Setting Up Grafana for Effective Kubernetes MonitoringTo begin monitoring Kubernetes with Grafana, first, check that you have all the requirements in place: a functioning Kubernetes cluster, the Helm package manager installed, and kubectl set up to communicate with your cluster.Install Grafana in a Kubernetes Cluster. Start by adding the Grafana Helm repository.helm repo add grafana https://grafana.github.io/helm-chartshelm repo updateNext, install Grafana using Helm. This command deploys Grafana into your Kubernetes cluster:helm install grafana grafana/grafanaNow it’s time to configure Grafana for the Kubernetes environment. After installation, retrieve the admin password by using the command below:kubectl get secret --namespace default grafana -o jsonpath="{.data.admin-password}" | base64 --decode ; echoThen access the Grafana UI by port-forwarding:kubectl port-forward svc/grafana 3000:80Open your web browser and navigate to http://localhost:3000. Log in using the default username admin and the password you retrieved. Once logged in, you can configure Grafana to monitor your Kubernetes environment by adding data sources such as Prometheus and creating custom dashboards.You’ve now successfully set up Grafana for Kubernetes monitoring!Key Metrics for Kubernetes MonitoringUnderstanding metrics for Kubernetes monitoring allows you to visualize your cluster’s reliability. Key metrics are the following:Node resources. Track CPU and memory usage, disk utilization, and network bandwidth to understand resource consumption and identify bottlenecks.Cluster metrics. Monitor the number of nodes to understand resource billing and overall cluster usage, and track running pods to determine node capacity and identify failures.Pod metrics. Measure how pods are managed and deployed, including instances and deployment status, and monitor container metrics like CPU, memory, and network usage.State metrics. Keep an eye on persistent volumes, disk pressure, crash loops, and job success rates to ensure proper resource management and application stability.Container metrics. Track container CPU and memory usage relative to pod limits, and monitor network data to detect bandwidth issues.Application metrics. Measure application availability, performance, and business-specific metrics to maintain optimal user experience and operational health.Setting Up Grafana DashboardsYou can opt to design and tailor Grafana dashboards to monitor your Kubernetes cluster. This will help you better understand your systems’ performance and overall well-being at a glance.Log into Grafana. Open your web browser, go to http://localhost:3000/, and log in with the default credentials (admin for both username and password), then change your password if/when prompted.Grafana—Log In to Start MonitoringAdd data source. Navigate to Configuration and select Data Sources. Click on Add Data Source and choose the appropriate data source, such as Prometheus.Create a dashboard. Go to Create > Dashboard, click Add New Panel, choose the panel type (e.g., Time series chart, Gauge, Table), and configure it with a PromQL query and visualization settings.Adding a New Panel in Grafana DashboardOrganize and save the dashboard. Arrange panels by clicking Add Panel > Add Row and dragging panels into the desired rows. To save the dashboard, click the save icon, name it, and confirm the save.Gcore Managed Kubernetes for Kubernetes MonitoringWhether you’re getting started with monitoring Kubernetes or you’re a seasoned pro, Gcore Managed Kubernetes offers significant advantages for businesses seeking efficient and reliable Kubernetes cluster monitoring and container management:Ease of integrating Grafana: The service seamlessly integrates with Grafana, enabling effortless visualization and monitoring of performance metrics via dashboards.Automated control: Gcore Managed Kubernetes simplifies the setup and monitoring process by using automation. This service conducts health checks on your nodes, automatically updating and restarting them when needed to keep performance at its best.Enhanced security and reliability: Gcore Managed Kubernetes guarantees the management of nodes by integrating features like automatic scaling and self-repairing systems to maintain optimal performance.Discover Gcore Managed Kubernetes, including automated scaling, one-click provisioning, and Grafana integration.

Subscribe to our newsletter

Get the latest industry trends, exclusive insights, and Gcore updates delivered straight to your inbox.