Skip to content

Commit 8c07835

Browse files
yangshunyangshun
committed
qns: update metadata
1 parent 69086b3 commit 8c07835

File tree

52 files changed

+187
-284
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

52 files changed

+187
-284
lines changed

‎README.md

+5-5
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,7 @@ Curated top React.js interview questions with high quality answers for acing you
3838
| 28 | [What is React strict mode and what are its benefits?](#what-is-react-strict-mode-and-what-are-its-benefits) |
3939
| 29 | [How do you localize React applications?](#how-do-you-localize-react-applications) |
4040
| 30 | [What is code splitting in a React application?](#what-is-code-splitting-in-a-react-application) |
41-
| 31 | [How would one optimise the performance of React contexts to reduce rerenders?](#how-would-one-optimise-the-performance-of-react-contexts-to-reduce-rerenders) |
41+
| 31 | [How would one optimize the performance of React contexts to reduce rerenders?](#how-would-one-optimize-the-performance-of-react-contexts-to-reduce-rerenders) |
4242
| 32 | [What are higher order components in React?](#what-are-higher-order-components-in-react) |
4343
| 33 | [Explain one-way data flow of React and its benefits](#explain-one-way-data-flow-of-react-and-its-benefits) |
4444
| 34 | [How do you handle asynchronous data loading in React applications?](#how-do-you-handle-asynchronous-data-loading-in-react-applications) |
@@ -656,21 +656,21 @@ Curated top React.js interview questions with high quality answers for acing you
656656
<br>
657657
<br>
658658
659-
31. ### How would one optimise the performance of React contexts to reduce rerenders?
659+
31. ### How would one optimize the performance of React contexts to reduce rerenders?
660660
661-
<!-- Update here: /questions/how-would-one-optimise-the-performance-of-react-contexts-to-reduce-rerenders/en-US.mdx -->
661+
<!-- Update here: /questions/how-would-one-optimize-the-performance-of-react-contexts-to-reduce-rerenders/en-US.mdx -->
662662
663663
To optimize the performance of React contexts and reduce rerenders, you can use techniques such as memoizing context values, splitting contexts, and using selectors. Memoizing context values with `useMemo` ensures that the context value only changes when its dependencies change. Splitting contexts allows you to isolate state changes to specific parts of your application. Using selectors with libraries like `use-context-selector` can help you only rerender components that actually need the updated context value.
664664
665665
```javascript
666666
const value = useMemo(() => ({ state, dispatch }), [state, dispatch]);
667667
```
668668
669-
<!-- Update here: /questions/how-would-one-optimise-the-performance-of-react-contexts-to-reduce-rerenders/en-US.mdx -->
669+
<!-- Update here: /questions/how-would-one-optimize-the-performance-of-react-contexts-to-reduce-rerenders/en-US.mdx -->
670670
671671
<br>
672672
673-
> Read the [detailed answer](https://greatfrontend.com/questions/quiz/how-would-one-optimise-the-performance-of-react-contexts-to-reduce-rerenders) on [GreatFrontEnd](https://greatfrontend.com/) which allows progress tracking, contains more code samples, and useful resources.
673+
> Read the [detailed answer](https://greatfrontend.com/questions/quiz/how-would-one-optimize-the-performance-of-react-contexts-to-reduce-rerenders) on [GreatFrontEnd](https://greatfrontend.com/) which allows progress tracking, contains more code samples, and useful resources.
674674
675675
[Back to top ↑](#table-of-contents)
676676
<br>

‎questions/explain-one-way-data-flow-of-react-and-its-benefits/metadata.json

+4-6
Original file line numberDiff line numberDiff line change
@@ -2,16 +2,14 @@
22
"slug": "explain-one-way-data-flow-of-react-and-its-benefits",
33
"languages": [],
44
"companies": [],
5-
"premium": false,
5+
"access": "free",
66
"duration": 5,
77
"published": true,
88
"featured": true,
99
"category": "react",
10-
"topics": [
11-
"react"
12-
],
13-
"importance": "low",
10+
"topics": ["react"],
11+
"importance": "medium",
1412
"ranking": 350,
15-
"difficulty": "easy",
13+
"difficulty": "medium",
1614
"section": "patterns"
1715
}

‎questions/explain-server-side-rendering-of-react-applications-and-its-benefits/metadata.json

+3-5
Original file line numberDiff line numberDiff line change
@@ -2,16 +2,14 @@
22
"slug": "explain-server-side-rendering-of-react-applications-and-its-benefits",
33
"languages": [],
44
"companies": [],
5-
"premium": false,
5+
"access": "free",
66
"duration": 5,
77
"published": true,
88
"featured": true,
99
"category": "react",
10-
"topics": [
11-
"react"
12-
],
10+
"topics": ["react"],
1311
"importance": "low",
1412
"ranking": 370,
15-
"difficulty": "easy",
13+
"difficulty": "medium",
1614
"section": "patterns"
1715
}

‎questions/explain-static-generation-of-react-applications-and-its-benefits/metadata.json

+3-5
Original file line numberDiff line numberDiff line change
@@ -2,16 +2,14 @@
22
"slug": "explain-static-generation-of-react-applications-and-its-benefits",
33
"languages": [],
44
"companies": [],
5-
"premium": false,
5+
"access": "free",
66
"duration": 5,
77
"published": true,
88
"featured": true,
99
"category": "react",
10-
"topics": [
11-
"react"
12-
],
10+
"topics": ["react"],
1311
"importance": "low",
1412
"ranking": 380,
15-
"difficulty": "easy",
13+
"difficulty": "medium",
1614
"section": "patterns"
1715
}

‎questions/explain-the-composition-pattern-in-react/metadata.json

+4-6
Original file line numberDiff line numberDiff line change
@@ -2,16 +2,14 @@
22
"slug": "explain-the-composition-pattern-in-react",
33
"languages": [],
44
"companies": [],
5-
"premium": false,
5+
"access": "free",
66
"duration": 5,
77
"published": true,
88
"featured": true,
99
"category": "react",
10-
"topics": [
11-
"react"
12-
],
13-
"importance": "low",
10+
"topics": ["react"],
11+
"importance": "medium",
1412
"ranking": 440,
15-
"difficulty": "easy",
13+
"difficulty": "medium",
1614
"section": "patterns"
1715
}

‎questions/explain-the-presentational-vs-container-component-pattern-in-react/metadata.json

+4-6
Original file line numberDiff line numberDiff line change
@@ -2,16 +2,14 @@
22
"slug": "explain-the-presentational-vs-container-component-pattern-in-react",
33
"languages": [],
44
"companies": [],
5-
"premium": false,
5+
"access": "free",
66
"duration": 5,
77
"published": true,
88
"featured": true,
99
"category": "react",
10-
"topics": [
11-
"react"
12-
],
13-
"importance": "low",
10+
"topics": ["react"],
11+
"importance": "medium",
1412
"ranking": 390,
15-
"difficulty": "easy",
13+
"difficulty": "medium",
1614
"section": "patterns"
1715
}

‎questions/explain-what-happens-when-setstate-is-called-in-react/metadata.json

+4-6
Original file line numberDiff line numberDiff line change
@@ -2,16 +2,14 @@
22
"slug": "explain-what-happens-when-setstate-is-called-in-react",
33
"languages": [],
44
"companies": [],
5-
"premium": false,
5+
"access": "free",
66
"duration": 5,
77
"published": true,
88
"featured": true,
99
"category": "react",
10-
"topics": [
11-
"react"
12-
],
13-
"importance": "low",
10+
"topics": ["react"],
11+
"importance": "medium",
1412
"ranking": 500,
15-
"difficulty": "easy",
13+
"difficulty": "medium",
1614
"section": "internals"
1715
}

‎questions/explain-what-react-hydration-is/metadata.json

+3-5
Original file line numberDiff line numberDiff line change
@@ -2,16 +2,14 @@
22
"slug": "explain-what-react-hydration-is",
33
"languages": [],
44
"companies": [],
5-
"premium": false,
5+
"access": "free",
66
"duration": 5,
77
"published": true,
88
"featured": true,
99
"category": "react",
10-
"topics": [
11-
"react"
12-
],
10+
"topics": ["react"],
1311
"importance": "low",
1412
"ranking": 260,
15-
"difficulty": "easy",
13+
"difficulty": "hard",
1614
"section": "advanced"
1715
}

‎questions/how-do-you-debug-react-applications/metadata.json

+3-5
Original file line numberDiff line numberDiff line change
@@ -2,16 +2,14 @@
22
"slug": "how-do-you-debug-react-applications",
33
"languages": [],
44
"companies": [],
5-
"premium": false,
5+
"access": "free",
66
"duration": 5,
77
"published": true,
88
"featured": true,
99
"category": "react",
10-
"topics": [
11-
"react"
12-
],
10+
"topics": ["react"],
1311
"importance": "low",
1412
"ranking": 280,
15-
"difficulty": "easy",
13+
"difficulty": "hard",
1614
"section": "advanced"
1715
}

‎questions/how-do-you-decide-between-using-react-state-context-and-external-state-managers/metadata.json

+4-6
Original file line numberDiff line numberDiff line change
@@ -2,16 +2,14 @@
22
"slug": "how-do-you-decide-between-using-react-state-context-and-external-state-managers",
33
"languages": [],
44
"companies": [],
5-
"premium": false,
5+
"access": "free",
66
"duration": 5,
77
"published": true,
88
"featured": true,
99
"category": "react",
10-
"topics": [
11-
"react"
12-
],
13-
"importance": "low",
10+
"topics": ["react"],
11+
"importance": "high",
1412
"ranking": 430,
15-
"difficulty": "easy",
13+
"difficulty": "medium",
1614
"section": "patterns"
1715
}

‎questions/how-do-you-handle-asynchronous-data-loading-in-react-applications/metadata.json

+4-6
Original file line numberDiff line numberDiff line change
@@ -2,16 +2,14 @@
22
"slug": "how-do-you-handle-asynchronous-data-loading-in-react-applications",
33
"languages": [],
44
"companies": [],
5-
"premium": false,
5+
"access": "free",
66
"duration": 5,
77
"published": true,
88
"featured": true,
99
"category": "react",
10-
"topics": [
11-
"react"
12-
],
13-
"importance": "low",
10+
"topics": ["react", "async"],
11+
"importance": "high",
1412
"ranking": 360,
15-
"difficulty": "easy",
13+
"difficulty": "medium",
1614
"section": "patterns"
1715
}

‎questions/how-do-you-localize-react-applications/metadata.json

+3-5
Original file line numberDiff line numberDiff line change
@@ -2,16 +2,14 @@
22
"slug": "how-do-you-localize-react-applications",
33
"languages": [],
44
"companies": [],
5-
"premium": false,
5+
"access": "free",
66
"duration": 5,
77
"published": true,
88
"featured": true,
99
"category": "react",
10-
"topics": [
11-
"react"
12-
],
10+
"topics": ["react", "i18n"],
1311
"importance": "low",
1412
"ranking": 300,
15-
"difficulty": "easy",
13+
"difficulty": "medium",
1614
"section": "advanced"
1715
}

‎questions/how-do-you-reset-a-components-state-in-react/metadata.json

+4-6
Original file line numberDiff line numberDiff line change
@@ -2,16 +2,14 @@
22
"slug": "how-do-you-reset-a-components-state-in-react",
33
"languages": [],
44
"companies": [],
5-
"premium": false,
5+
"access": "free",
66
"duration": 5,
77
"published": true,
88
"featured": true,
99
"category": "react",
10-
"topics": [
11-
"react"
12-
],
13-
"importance": "low",
10+
"topics": ["react"],
11+
"importance": "medium",
1412
"ranking": 220,
15-
"difficulty": "easy",
13+
"difficulty": "medium",
1614
"section": "intermediate"
1715
}

‎questions/how-do-you-test-react-applications/metadata.json

+3-5
Original file line numberDiff line numberDiff line change
@@ -2,16 +2,14 @@
22
"slug": "how-do-you-test-react-applications",
33
"languages": [],
44
"companies": [],
5-
"premium": false,
5+
"access": "free",
66
"duration": 5,
77
"published": true,
88
"featured": true,
99
"category": "react",
10-
"topics": [
11-
"react"
12-
],
10+
"topics": ["react"],
1311
"importance": "low",
1412
"ranking": 250,
15-
"difficulty": "easy",
13+
"difficulty": "medium",
1614
"section": "intermediate"
1715
}

‎questions/how-does-virtual-dom-in-react-work-what-are-its-benefits-and-downsides/metadata.json

+4-6
Original file line numberDiff line numberDiff line change
@@ -2,16 +2,14 @@
22
"slug": "how-does-virtual-dom-in-react-work-what-are-its-benefits-and-downsides",
33
"languages": [],
44
"companies": [],
5-
"premium": false,
5+
"access": "free",
66
"duration": 5,
77
"published": true,
88
"featured": true,
99
"category": "react",
10-
"topics": [
11-
"react"
12-
],
13-
"importance": "low",
10+
"topics": ["react"],
11+
"importance": "high",
1412
"ranking": 460,
15-
"difficulty": "easy",
13+
"difficulty": "hard",
1614
"section": "internals"
1715
}

‎questions/how-would-one-optimise-the-performance-of-react-contexts-to-reduce-rerenders/en-US.mdx renamed to ‎questions/how-would-one-optimize-the-performance-of-react-contexts-to-reduce-rerenders/en-US.mdx

+1-2
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
---
2-
title: How would one optimise the performance of React contexts to reduce rerenders?
2+
title: How would one optimize the performance of React contexts to reduce rerenders?
33
---
44

55
## TL;DR
@@ -82,4 +82,3 @@ const MyComponent = () => {
8282
- [React Context API documentation](https://reactjs.org/docs/context.html)
8383
- [useMemo Hook documentation](https://reactjs.org/docs/hooks-reference.html#usememo)
8484
- [use-context-selector library](https://github.com/dai-shi/use-context-selector)
85-

‎questions/how-would-one-optimise-the-performance-of-react-contexts-to-reduce-rerenders/metadata.json renamed to ‎questions/how-would-one-optimize-the-performance-of-react-contexts-to-reduce-rerenders/metadata.json

+5-7
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,15 @@
11
{
2-
"slug": "how-would-one-optimise-the-performance-of-react-contexts-to-reduce-rerenders",
2+
"slug": "how-would-one-optimize-the-performance-of-react-contexts-to-reduce-rerenders",
33
"languages": [],
44
"companies": [],
5-
"premium": false,
5+
"access": "free",
66
"duration": 5,
77
"published": true,
88
"featured": true,
99
"category": "react",
10-
"topics": [
11-
"react"
12-
],
13-
"importance": "low",
10+
"topics": ["react", "performance"],
11+
"importance": "high",
1412
"ranking": 320,
15-
"difficulty": "easy",
13+
"difficulty": "medium",
1614
"section": "advanced"
1715
}

‎questions/what-are-error-boundaries-in-react-for/metadata.json

+3-5
Original file line numberDiff line numberDiff line change
@@ -2,16 +2,14 @@
22
"slug": "what-are-error-boundaries-in-react-for",
33
"languages": [],
44
"companies": [],
5-
"premium": false,
5+
"access": "free",
66
"duration": 5,
77
"published": true,
88
"featured": true,
99
"category": "react",
10-
"topics": [
11-
"react"
12-
],
10+
"topics": ["react"],
1311
"importance": "low",
1412
"ranking": 240,
15-
"difficulty": "easy",
13+
"difficulty": "medium",
1614
"section": "intermediate"
1715
}

‎questions/what-are-higher-order-components-in-react/metadata.json

+4-6
Original file line numberDiff line numberDiff line change
@@ -2,16 +2,14 @@
22
"slug": "what-are-higher-order-components-in-react",
33
"languages": [],
44
"companies": [],
5-
"premium": false,
5+
"access": "free",
66
"duration": 5,
77
"published": true,
88
"featured": true,
99
"category": "react",
10-
"topics": [
11-
"react"
12-
],
13-
"importance": "low",
10+
"topics": ["react"],
11+
"importance": "medium",
1412
"ranking": 330,
15-
"difficulty": "easy",
13+
"difficulty": "medium",
1614
"section": "patterns"
1715
}

0 commit comments

Comments
 (0)