Key Concepts to Understand Database Sharding.
In this concise and visually engaging resource, we break down the key concepts of database partitioning, explaining both vertical and horizontal strategies.
1. Range-Based Sharding: Splitting your data into distinct ranges. Think of it as organizing your books by genre on separate shelves.
2. Key-Based Sharding (with a dash of %3 hash): Imagine each piece of data having a unique key, and we distribute them based on a specific rule. It's like sorting your playing cards by suit and number.
3. Directory-Based Sharding: A directory, like a phone book, helps you quickly find the information you need. Similarly, this technique uses a directory to route data efficiently.
Over to you: What are some other ways to scale a database?
Subscribe to our weekly newsletter to get a Free System Design PDF (158 pages): https://bit.ly/3KCnWXq
Credit - ByteByteGo
In this concise and visually engaging resource, we break down the key concepts of database partitioning, explaining both vertical and horizontal strategies.
1. Range-Based Sharding: Splitting your data into distinct ranges. Think of it as organizing your books by genre on separate shelves.
2. Key-Based Sharding (with a dash of %3 hash): Imagine each piece of data having a unique key, and we distribute them based on a specific rule. It's like sorting your playing cards by suit and number.
3. Directory-Based Sharding: A directory, like a phone book, helps you quickly find the information you need. Similarly, this technique uses a directory to route data efficiently.
Over to you: What are some other ways to scale a database?
Subscribe to our weekly newsletter to get a Free System Design PDF (158 pages): https://bit.ly/3KCnWXq
Credit - ByteByteGo
We know that JavaScript is a single-threaded language, which simply means that it can handle only one task at a time.
But if that's the case, how does it handle asynchronous operations (like Promises) and that too pretty efficiently? This is possible thanks to something called the Event Loop. The event loop works in the following manner:
1. Call Stack: When our code runs, functions are pushed into a stack (known as the call stack) and processed one after the other. If these functions call other functions, the new functions are placed on top of the stack, above the parent function that called them.
2. Web APIs/Task Queue: When asynchronous operations (like setTimeout or I/O tasks) are encountered, they are sent to the browser's Web APIs, which handle them separately from the call stack. This means that these asynchronous operations are not handled by the JavaScript runtime itself. The task queue is further divided into two parts: the Macrotask Queue and the Microtask Queue.
• The Macrotask Queue includes tasks like setTimeout, setInterval, and I/O tasks.
• The Microtask Queue includes tasks like Promises (specifically, the .then() and .catch() handlers).
After each macrotask completes, the event loop first checks and processes all the tasks in the microtask queue before doing the next macrotask. This is why tasks in the microtask queue are always executed first, even if they are scheduled after macrotasks.
3. Event Loop: Once the asynchronous task is complete, the event loop checks if the call stack is empty. If it is, the results (callbacks or events, not the original asynchronous tasks themselves) from the task queue are pushed into the call stack to be executed. This cycle continues indefinitely.
This brilliant mechanism allows JavaScript to appear as though it is multitasking, when in reality, it simply juggles tasks in an efficient order.
Credit - Prince Raj
But if that's the case, how does it handle asynchronous operations (like Promises) and that too pretty efficiently? This is possible thanks to something called the Event Loop. The event loop works in the following manner:
1. Call Stack: When our code runs, functions are pushed into a stack (known as the call stack) and processed one after the other. If these functions call other functions, the new functions are placed on top of the stack, above the parent function that called them.
2. Web APIs/Task Queue: When asynchronous operations (like setTimeout or I/O tasks) are encountered, they are sent to the browser's Web APIs, which handle them separately from the call stack. This means that these asynchronous operations are not handled by the JavaScript runtime itself. The task queue is further divided into two parts: the Macrotask Queue and the Microtask Queue.
• The Macrotask Queue includes tasks like setTimeout, setInterval, and I/O tasks.
• The Microtask Queue includes tasks like Promises (specifically, the .then() and .catch() handlers).
After each macrotask completes, the event loop first checks and processes all the tasks in the microtask queue before doing the next macrotask. This is why tasks in the microtask queue are always executed first, even if they are scheduled after macrotasks.
3. Event Loop: Once the asynchronous task is complete, the event loop checks if the call stack is empty. If it is, the results (callbacks or events, not the original asynchronous tasks themselves) from the task queue are pushed into the call stack to be executed. This cycle continues indefinitely.
This brilliant mechanism allows JavaScript to appear as though it is multitasking, when in reality, it simply juggles tasks in an efficient order.
Credit - Prince Raj
Why do React components need to start with capital letters?
If you’ve ever worked with React, you might have noticed that component names always start with capital letters. But do you know why? 🤔
In JSX, React components are written in a syntax that gets transformed into plain JavaScript using the React.createElement API, thanks to Babel. Here’s where the capital letter comes in:
When Babel encounters a name starting with a capital letter, it knows it’s dealing with a React component and converts it into a React Fiber object (a key part of React’s rendering system).
On the other hand, if the name starts with a lowercase letter, Babel treats it as a string rather than a component. This helps React differentiate between native HTML elements and custom components!
So, always remember to capitalize your component names for React to interpret them correctly. 💡
Credit - Vasudevan LK
If you’ve ever worked with React, you might have noticed that component names always start with capital letters. But do you know why? 🤔
In JSX, React components are written in a syntax that gets transformed into plain JavaScript using the React.createElement API, thanks to Babel. Here’s where the capital letter comes in:
When Babel encounters a name starting with a capital letter, it knows it’s dealing with a React component and converts it into a React Fiber object (a key part of React’s rendering system).
On the other hand, if the name starts with a lowercase letter, Babel treats it as a string rather than a component. This helps React differentiate between native HTML elements and custom components!
So, always remember to capitalize your component names for React to interpret them correctly. 💡
Credit - Vasudevan LK
Java SpringBoot Roadmap :
➤ 1. Java SE
1.1. OOP.
1.2. Exception Handling.
1.3. Multithreading.
1.4. Collections(List,Set,Map, ... )
1.5. JDBC
1.6. It is required to be familir with hashtag
hashtag#java8 features stream and lambda expressions
➤ 2. DBMS
2.1. Data modeling
2.2. Relational data Model
2.3. Normalization
2.4. Transaction Processing
2.5. Concurrency Control
➤ 3. Java EE
3.1. Servlets
3.2. JSP
3.3. JSTL
➤ 4. Hibernate
➤ 5. Web Service
5.1. RESTful API (The Most popular With Spring)
5.2. It is better to be familiar with SOAP Web Service
➤ 6. Spring
6.1. Spring Core
6.2. Spring Data
6.3. Spring MVC
6.4. Spring RESTful API
6.5. Spring Boot
6.6. Spring Security
➤ 7. Advanced Topics
7.1. Solid principles
7.2. Design Pattern
7.3. Microservices and Spring Cloud
➤ 8. maven and Git
Credit - Rani Dhage
➤ 1. Java SE
1.1. OOP.
1.2. Exception Handling.
1.3. Multithreading.
1.4. Collections(List,Set,Map, ... )
1.5. JDBC
1.6. It is required to be familir with hashtag
hashtag#java8 features stream and lambda expressions
➤ 2. DBMS
2.1. Data modeling
2.2. Relational data Model
2.3. Normalization
2.4. Transaction Processing
2.5. Concurrency Control
➤ 3. Java EE
3.1. Servlets
3.2. JSP
3.3. JSTL
➤ 4. Hibernate
➤ 5. Web Service
5.1. RESTful API (The Most popular With Spring)
5.2. It is better to be familiar with SOAP Web Service
➤ 6. Spring
6.1. Spring Core
6.2. Spring Data
6.3. Spring MVC
6.4. Spring RESTful API
6.5. Spring Boot
6.6. Spring Security
➤ 7. Advanced Topics
7.1. Solid principles
7.2. Design Pattern
7.3. Microservices and Spring Cloud
➤ 8. maven and Git
Credit - Rani Dhage