221 questions
0 votes
4 answers
262 views
Protecting HTML DOM attributes from DEV tools
I need to be able to store protected, DOM element, attributes at the UI. (For example, I want to store the DBKEY of the target database row along side the matching table row.) As I can see no way of ...
0 votes
0 answers
22 views
Tabulator's issue with adding rows and rendering scrollbars virtually
I'm having the following issue with Tabulator. When I initialize and add a hundred rows of data, I scroll to the bottom and then append another 500 rows via the button, the position of the scrollbar ...
0 votes
0 answers
33 views
why react dev tools paint highlights to components in this example
//App.tsx import { A } from "./A"; import { B } from "./B"; function App() { return ( <> <div> <B /> </div> <A /> ...
1 vote
2 answers
94 views
React: How to detect the same components
First of all, sorry for my poor English! (translated by DeepL) MyComponent has some 'state' like a counter and displays it. In pattern A, when the hiddenFlag is switched, 'state' of the first ...
1 vote
3 answers
234 views
How does React update only the parts of the DOM that need updating? [closed]
How is React able to update only the parts of the DOM that require updating (because they've changed) as opposed to re-rendering the entire DOM? From what I understand, regular HTML/Javascript web ...
3 votes
2 answers
271 views
Which is created first: the Real DOM or the virtual DOM?
When a React app is rendered for the first time, is the real DOM or the virtual DOM created first? React with JSX is converted to React.createElement(). So, does virtual DOM creation start from here ...
0 votes
1 answer
167 views
next.js 14 component broken when using translation feature from Chrome
In a next.js 14 app, I have this component import { FormControl, FormField, FormItem, FormLabel, FormLabelContent, FormMessage, LabelWithTooltipProps } from "@/components/ui/form"; import { ...
1 vote
0 answers
62 views
Why do people say that the virtual DOM is more efficient than the actual DOM?
Any answer to what the question of what the difference is between virtual DOM and the DOM in React will inevitably tell you that it's more efficient because React only updates the elements that it ...
1 vote
0 answers
124 views
Is the virtual DOM in VueJS redundant?
Can anyone tell me if VueJS has fine-grained reactivity, similar to signals that use a sub-push mechanism to update directly on the actual DOM? If so, does that make the virtual DOM redundant? I want ...
0 votes
1 answer
29 views
How is react element tree is constructed for wrapped components?
consider I have a below app structure const App = () => { return <div><Header /><Main/><Footer/></div> } const Header = () => { return <>Header</&...
3 votes
2 answers
3k views
What is the difference between Virtual DOM and ReactDOM?
I am going through lot of articles over the internet asking the difference between the two, but almost everyone of them explains the difference between Virual DOM and Real DOM. According to my current ...
1 vote
3 answers
2k views
How does React's Virtual DOM improve performance compared to direct manipulation of the actual DOM?
I'm currently learning React and I've come across the concept of the Virtual DOM. I understand that one of the key advantages of React is its use of a Virtual DOM to improve performance, but I'm ...
-1 votes
1 answer
59 views
What is the purpose of reactDOM in reactjs [duplicate]
Explanation: why reactjs use virtual Dom concept, how does it different from orginal Dom. Explain with suitable example . Also explain how react Dom render jsx components How react virtual Dom works ...
0 votes
1 answer
194 views
what does the document object in react refers to? (core dom or virtual dom)
I have been plagued with this question in my early react days, and it felt too stupid to ask, but I couldn't wait anymore. I understand, virtual DOM is merely an object representation of the DOM in ...
0 votes
1 answer
50 views
Why uncontrolled input elements lose inputs during reconciliation?
Below is the sample code that display a checkbox to wrap content, an text input field, and a counter with a button to increment export default class App extends Component { constructor(props) { ...