teleren/devto huggingface dataset:
Performance Profiling a Mongoid Issue Using AppProfiler
Tags: ruby, performance, mongodb
Published: 2022-09-09 12:02:07

In [MONGOID-4889](https://jira.mongodb.org/browse/MONGOID-4889) the claim was made that assignment of a large number of embedded documents to an instance of a model will take increasingly longer as the size of the list of documents to embed grows. This is notable as no database operations are being performed during this process, which points to potential issues with the library itself. The ticket author identified [`Mongoid::Association::Embedded::EmbedsMany::Proxy#object_already_related?`](https://github.com/mongodb/mongoid/blob/v8.0.0/lib/mongoid/association/embedded/embeds_many/proxy.rb#L359-L361) as the likely source of this performance issue, however I wanted to see how best to validate this.

While doing research on Ruby profiling I found Shopify's blog post on ["How to Fix Slow Code in Ruby"](https://shopify.engineering/how-fix-slow-code-ruby). Though the entire post was extremely insightful, it lead me to Shopify's [`app_profiler`](https://github.com/Shopify/app_profiler) library, which can be used to automatically profile code and redirect the output to a local instance of [speedscope](https://github.com/jlfwong/speedscope). Having worked previously with [Flame Graphs](https://www.brendangregg.com/flamegraphs.html) of CPU stack traces collected using [`perf`](https://man7.org/linux/man-pages/man1/perf.1.html).

Adapting the sample code in the Jira ticket results in the following:

```ruby
require 'bundler/inline'

gemfile do
  source 'https://rubygems.org'

  gem 'mongoid'
  gem 'app_profiler'
end

class Foo
  include Mongoid::Document
  embeds_many :bars
end

class Bar
  include Mongoid::Document
  embedded_in :foo
end

# AppProfiler forms the output filename using Time.zone.now
require 'active_support/core_ext/time/zones'
Time.zone = 'Pacific Time (US & Canada)'
AppProfiler.root = Pathname.new(__dir__)
AppProfiler.profile_root = Pathname.new(__dir__)

arr = Array.new(2000) { Bar.new }
report = AppProfiler.run(mode: :cpu) do
  Foo.new.bars = arr
end
report.view
```

Running the above code doesn't require a MongoDB connection string or an active cluster, but will attempt to embed 2000 new instances of `Bar` into the newly created instance of `Foo`. Once completed, the following chart is produced that reinforces the initial suspicion that the calls to `object_already_related?` are a likely candidate for further investigation.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/rhyx2bekmw3tjkpvamf5.png)

AppProfiler was designed to be injected into a Rails application, however as can be seen above, it can easily be adapted to work on a standalone Ruby script as well.
5 CLI Tools Every Developer Must Learn
Tags: programming, devops, sre
Published: 2022-09-09 11:51:26

If you are a beginner developer, this is a good starting point for your studies. If you are a senior already and you are not familiar with these tools, would be a good moment to step back a while and improve some fundamentals.

## 1 - Linux terminal

You don't necessarily need to create a dual boot on your computer to learn Linux terminal. MacOS and Linux have similar terminal commands and for Windows users there are alternatives like Git bash or WLS. But as developer, you need to be familiar with Linux terminal commands, at least, the basic ones like navigating the file system, listing processes, creating links, creating and listing environment variables, setting permissions and executing files. Standard input and output redirection and processes pipelining would be a good catch too.

## 2 - man pages

Linux man (man stands for MANual) pages could be part of the topic 1 but deserves a special place. Back to 1970s, when UNIX was created, computer operators needed a way to check how a command worked. And because they could not memorize everything and there was no Google nor Stackoverflow, the command man was created. So, it's a quite simple command that returns the documentation of the referenced command on the terminal. Creating the habit of reading the man pages leads you to quickly master using the Linux terminal

## 3 - ssh

Most of time we develop in network environments, and we need to do it securely. So, you need to know how to create an encrypted connection to another computer over a network so you can operate it via terminal.

## 4 - git

Although most of IDEs have Git tooling integrated, I believe that going through CLI at least during your learning process can get you deeper on how the Git versioning process works. Also, code checkout is the first step during CI/CD pipelines, so you will need to understand how the CLI works to build that automation.

## 5 - bash/ksh/powershell

Finally, some basic knowledge of the scripting language of your favorite OS can help put all this together and then you'll be able to automate some daily tasks and be more productive.
3 CLI Tools Every Java Developer Must Learn
Tags: programming, java, productivity
Published: 2022-09-09 11:54:53

## 1 - java

This is the essential tool that every serious Java developer must master. The java command is part of the Java SDK and invokes the JVM (Java Virtual Machine). This command is responsible for running Java programs compiled into Java bytecode. The java command is the heart of the Java platform. By practicing the java command, you can learn how to invoke a java program through a .class file or .jar file, how to setup the classpath for the JVM, how to setup the size of the heap space, how can you set different modes of execution of the garbage collector or even how can you configure the JVM to dump the memory to a file in the moment when it crashes. These skills make an enormous difference when running systems in production.

## 2 - javac

The javac command is also part of the Java SDK and it invokes the Java compiler, used to compile a set of Java source code files into a set of Java bytecode files.

## 3 - Maven

Building and compiling simple application using the javac command is quite simple. However, for bigger application the process of building and packaging an application is much more complex. For this task you can use Maven. Although Maven is not part of Java specification, the Java community has widely adopted Maven for dependency management, build and package Java applications.
Dark Mode Toggle Feature (CSS only)
Tags: css, tutorial, html, design
Published: 2022-09-09 11:42:25

If you have been familiar with CSS for some time, then you know how powerful it is, not just for plane-styling HTML documents.
In this article, I will show you how you can achieve a dark mode toggle feature in your project using just CSS!
BTW this is my first article on dev.to so bear with me for some mistakes which I am surely going to make 😬

## Things you need to know:

1. HTML
2. CSS

## Approach
In our project, we will use a checkbox to toggle between light mode and dark mode. We will style the container's background and font color based on a checkbox property to wrap up our entire page content.

## HTML

```HTML
<!DOCTYPE html>
<html lang="en">
   <head>
      <meta charset="UTF-8">
      <meta http-equiv="X-UA-Compatible" content="IE=edge">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <link rel="stylesheet" href="style.css" type="text/css">
      <title>Dark Mode Toggle</title>
   </head>
   <body>
      <!-- Checkbox Toggle -->
      <input type="checkbox" id="toggle">

      <!-- Container -->
      <div class="container">
         Make sure to include all your content inside this container div.
      </div>

   </body>
</html>
```

## CSS
### Universal & Container Styling
We will start by giving the styling to the universal selector and the container.

```CSS
/* Universal Styling */
* {
  box-sizing: border-box;
  padding: 0;
  margin: 0;
}

/* Container for all the elements */
.container {
  width: 100%;
  min-height: 100vh;
  padding: 10px;
  background-color: #EEE;
  color: #333;
  transition: all 0.4s ease-out;
}
```
### Toggle Button Styling
Now we will turn our checkbox into a toggle button by applying some simple styles.

```CSS
/* Toggle Button */
#toggle {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  width: 60px;
  height: 30px;
  border-radius: 30px;
  background-color: #333;
  position: absolute;
  top: 50px;
  right: 50px;
  transition: all 0.5s ease-in;
  cursor: pointer;
  z-index: 1;
}

/* Making a dot switch inside the Toggle Button */
#toggle::before {
  content: "";
  width: 25px;
  height: 25px;
  border-radius: 50%;
  background: #EEE;
  position: absolute;
  top: 50%;
  left: 3px;
  transform: translateY(-50%);
  transition: all 0.5s ease-in;
}

/* Changing toggle button background when checked */
#toggle:checked {
  background: #03FFC0;
}

/* Changing dot switch color and moving to the right side when checked */
#toggle:checked::before {
  background: #333;
  left: 32px;
}
```
### Final Styling
Finally, we will change the container background using this style when the checkbox property is checked.

```CSS
/* Changing the background & font color when checked */
#toggle:checked ~ .container {
  background-color: #333;
  color: #EEE;
}
```

That's it! 🤩 You now have the fully working page with the dark mode toggle feature.
See the complete source code **[here](https://github.com/helloukey/dark-mode-toggle)**.
Video Tutorial: **[here](https://www.youtube.com/watch?v=y0H1DkjuSMo)**.

Thank you for reading! ❤
Why Developers Should Learn CLI Tools
Tags: programming, productivity, career, learning
Published: 2022-09-09 11:42:21

Nowadays, using CLI (Command Line Interfaces) to perform programing tasks may look antiquated, and although modern graphical IDEs can represent a gain of productivity in our daily routines, I honestly believe that developers should master using CLI tools. Specially those who are initiating in the profession or when we are learning a new language or tool. And these are few of my reasons to do so:

1 - By using a CLI allows you to get into details. For example, using mvn or dotnet commands to build your Java or C# application requires from you to go deep on the cycle build-test-run of an application. It also forces you to explore error messages and parameters when things go wrong. This kind of effort during your learning process increases your problem-solving capacity.

2 - CLIs are well-suited for automation. If you are familiar with CLIs and do a lot of repetitive and tedious tasks using commands, then you can easily automate them with the help of some scripting language like Bash or PowerShell.

Finally, my idea is not to tell you to just abandon IDEs or GUIs. They are great for visualization and for quick and ad-hoc tasks. But for our developer and SREs world, CLIs still play a crucial role and they mandatory in our toolboxes.
If you asked how long a job will take, don't provide an estimate - do this instead.
Tags: programming, agile, projectmanagement, beginners
Published: 2022-09-09 11:33:19

It is important to understand that even if we use the same word we could mean/understand different things.


When people ask "How long job will take" they may be interested in any of the following:

1. How long will you mostlikely spend doing the job
2. What is the best-case scenario?
3. When the job will be most certainly completed (worst case scenario)?
4. 

There're at least 63% chance you misunderstood the question. It might be the case that person who asks you doesn't know what they are interested themselves.


1. So what you should do instead? Consider these options:
2. Ask what figure they are interested in (mostlikely, best-case, worst case)
3. Provide all three estimates
4. If person needs a single number - suggest them checking 3 point estimations (https://www.youtube.com/watch?v=6U5UpDmI77A&t=115s)


If you want to know more about why estimates are usually wrong and what one can do about them - feel free to check this video:

{% embed https://www.youtube.com/watch?v=6U5UpDmI77A %}
The best Python Homework Help Experts
Tags: pythonhomeworkhelp, domypythonhomework, python, programming
Published: 2022-09-09 11:22:13

You simply need more than just Python Homework Help. This means that, upon hiring, make sure that your helper will help you achieve your expectations by delivering high-quality solutions. After all, that’s the reason you sought help, right? [Python Homework Help](https://www.pythonhomeworkhelp.com/) has always been one of the most trusted firms, in offering unsurpassed help with Python homework services. Also, with the help of our adept and certified programming writers, we provide solutions to any programming query understudies come to us with.
Why you choose Database Homework Help
Tags: databasehomeworkhelp, domydatabasehomework, database, sql
Published: 2022-09-09 11:06:15

We are a team of expert tutors and programmers with years of experience offering online tuition and [Database Homework Help](https://www.databasehomeworkhelp.com/) to students around the globe. Apart from online tuition, most of us have worked on database projects for different companies, and some even as Database administrators. We, therefore, have the expertise to get you the right knowledge when it comes to database-related homeworks.
Beautiful button animation
Tags: css, html, webdev, tutorial
Published: 2022-09-09 11:00:16


![Button image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/tbr5ka06ojyd1w97bbrd.png)

## <u>HTML</u>
For HTML we gave only one button element with 'rotation' class.

```html
<button class="rotation">design</button>
```
      

## <u>CSS</u>
For CSS, first we'll set some styling to a 'rotation' class.

We'll set a blue neon shadow, inside as well as outside.

Then we'll set text color to blue, remove the button's default border and round it to 5 pixels.

We'll position to relative, add some paddings and set background color to white.

```css
.rotation {
    background-color: #fff;
    box-shadow: 0 0 10px #5271ff,
            inset 0 0 10px #5271ff;
    color: #5e7cff;
    border: none;
    border-radius: 5px;
    padding: 10px 20px;
    position: relative;
}
```
      
Now we'll style the before and after pseudo elements.

These elements will rotate around the button as border.

First, we'll set the content, and position to absolute with -5px on all sides so it is 5px bigger than the button.

We'll round the borders for 5px and set it to solid two pixels wide light blue.

```css
.rotation::before, .rotation::after {
    content: '';
    border: 2px solid #b5c3ff;
    border-radius: 5px;
    position: absolute;
    top: -5px;
    bottom: -5px;
    left: -5px;
    right: -5px;
}
```
      
Now we'll create the animation for pseudo elements.

Using clip-path property, we'll create a linear rotation effect.

```css
@keyframes rotating {
    0% {clip-path: inset(96% 0 0 0);}
    20% {clip-path: inset(0 96% 0 0);}
    50% {clip-path: inset(0 0 96% 0);}
    75% {clip-path: inset(0 0 0 96%);}
    100% {clip-path: inset(96% 0 0 0);}
}
```
      
Now we'll add that animation to our pseudo elements.

We'll set the duration of 3 seconds, infinite and linear.

```css
.rotation::before, .rotation::after {
    content: '';
    border: 2px solid #b5c3ff;
    border-radius: 5px;
    position: absolute;
    top: -5px;
    bottom: -5px;
    left: -5px;
    right: -5px;
    animation: rotating 3s infinite linear; /*  Animation  */
}
```
      
Now we'll simply add animation delay of half the time (1.5 s) to after pseudo element.

```css
.rotation::after {
    animation-delay: 1.5s;
}
```
      
And that is it.

You can find the full code [here](https://designyff.com/code/design_button_animation) with video tutorial.

Thank you for reading. ❤️
MBOX to EML Converter
Tags: outlook, mbox, convertmboxtoeml
Published: 2022-09-09 10:59:00

Different email clients use MBOX format files to store and organise mailbox data, including Mozilla Thunderbird, Apple Mail, Entourage, and Eudora.

Users need their mailbox data in different email formats, such as EML, MSG, etc., in cases of email client migration. Windows Live Mail, Microsoft Outlook Express, and other email clients can access the mailbox data thanks to MBOX to EML conversion.

In this article, we'll use the [Advik MBOX to EML Converter](https://www.adviksoft.com/mbox/eml.html) tool to guide you step-by-step through the conversion of MBOX to EML.

The tool provides a wide range of adaptable features, including mailbox data conversion, import MBOX to Office 365, Exchange Server, Yahoo, etc. EML is one of the file formats that are converted for all emails and attachments.

## Steps to Convert MBOX to EML File

Follow the given instructions and convert MBOX file into EML format with attachments.  

Step 1. Install and Run **Advik MBOX Converter** tool on your system.

Step 2. After that, click on Select File of Folder and browse the .mbox file from the system. 

Step 3. Choose EML as a saving option from the given list.

Step 4. At last, browse the location to save the exported data file and hit on the Convert button.

Done! Here complete the process and you convert MBOX to EML format with attachments. 

## Benefits of Using Automated Tool

The programme proves to be the best and most effective tool for converting a set of MBOX files into the EML file format, whether they are single or multiple files. These are some of the main characteristics of this toolkit:

- Whether orphaned or linked to an email application, it supports MBOX files of all origins.
- To add an MBOX file, the tool provides two options (s).
- There are no limitations on users' ability to batch convert numerous mailbox files to EML.
- Allow to import MBOX to Gmail, Yahoo, Office 365 and other webmail accounts.
- Emails can be transferred into the EML file format using the utility along with all of their properties, including To, Cc, Bcc, and email headers.
- establishes a naming structure.
- Also convert MBOX to MSG, PST, CSV, PDF and various other file formats. 
- Before conversion, it allows users to preview all MBOX emails within the interface.
- During the export process, the software also asks if you want to keep or ignore the internal system folder hierarchy.

**Conclusion**

One of the best methods for obtaining the desired outcomes is the MBOX to EML converter. The free trial version is available for download and use. The first 25 MBOX email messages will be converted. You can purchase the licence to finish the conversion once the desired results have been obtained.
How to Push an empty commit?
Tags: javascript, git, webdev, beginners
Published: 2022-09-09 10:49:15

Have you ever tried to push a commit to a Git branch without changing any files in order to re-run your integration process? If yes then you are at the right corner. 

```
git commit --allow-empty -m “Message”
```
### Problem

For continuous integration, we are using AWS CI/CD delivery pipelines which allow us to build, test and deploy applications on a single push to a specific git branch. It helps us to reduce the manual overhead of deploying code to the server and handle all the actions automatically.

But today I faced a problem where I needed to re-run my delivery pipeline of a branch without adding any extra space or changing any files in the repository, so I searched for the solution for a while and It turns out that Git is allowing us to push an empty commit without adding any staged files to the branch, by using one option --allow-empty during git commit.

Enough of the problem, let’s jump on to the solution
Pushing a commit with staged files

```
git add .

git commit -m "changes on app controller"

git push origin master 
```

The above commands will add all unstaged files and add commit and push the code to the master branch, after that our delivery pipeline will be started.

Once the pipeline process fails or you need to run the process again, you will have to push something to the branch but as I mentioned earlier, we will not make any changes to the files, and even then, We will be able to commit the branch with this command.

Pushing empty commit
```
git commit --allow-empty -m "rerunning the delivery pipeline"

git push origin master 
```

After the above commands, you can see that the commit has been pushed to your branch and the delivery pipeline will be started.

[](url)
Typescript Could not find declaration file for module 'react'
Tags: typescript, react, javascript, beginners
Published: 2022-09-09 10:34:31

Typescript has made it easy to locate errors, but most time QuickFix doesn't work. The error Could not find a declaration file for module 'Module Name' often happens when you start typescript. This is because typescript couldn't find the type deceleration for a react-related module. Don't panic it is easy to solve. Let's jump on it


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/6y94rrxbrpl3p1pt2y9s.png)

This is what the error message looks like in the terminal and these are ways to solve it.

1. **Install the @type package for the module**

```
// Installing the type module with npm
npm install @type/Module-Name

// Installing the type module for react-dom with npm
npm install @type/react-dom

// Installing the type module with npm

npm install @type/react-reveal
```

On the other hand, the error below might pop up when npm could not find the type of the module you are trying to install. 

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/dg3nymdd9y94sqm4u677.png)

If you fall into this error, that the module you are trying to install doesn't provide typing. So let's discuss another way of fixing this.

2. **Using a .d.ts files**

What are **.d.ts files**? These are **declaration files that contain only type information**. They are only used for checking types and typescript read them the same way it does with the regular .ts file which is mostly determined by the **Include** and **Exclude** setting in the **tsconfig.json** file

So create a .d.ts file in your project file inside your project file, it can have any name you want like the react-reveal.d.ts file (mostly use the module name), let's continue. Inside the file, you need to declare the module like this. 

```
declare module 'module-name'
```

Make sure you change the module name to the module you are trying to fix the error. In most cases, this fixes the error because, with this, typescript automatically set the module type of **any** and the code should work fine.
In some cases, we might want to set the type ourselves, if you want to set the type you can just can this to your code

```
declare module 'module-name' {
    export function myFunction(): string 
}
```

Unfortunately, if the error isn't clear, we might have another option to fix it,

3. **Adding the eslint-disable next line comment**

You can easily resolve the error by adding the **eslint-disable next line comment** to ignore the error on the code and allow your typescript to run perfectly without error

```
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
// @ts-ignore
import { myFunction } from 'module-name';

// Example
import { Bounce } from "react-reveal";

```

So, with any of these solution **Typescript  Could not find declaration file for module 'react'** can be fix. 

If you like the article and it would be beneficial, please like and share for friends to they can benefit. 

Thank you