romgrk

function devmodeStringHash(input: object | string | number | null) {
  let nextId = 0;
  const seen = new WeakMap<any, number>();

  return JSON.stringify(input, (_, v) => {
    if (v !== null && typeof v === 'object') {
      const id = seen.get(v);
      if (id !== undefined) {
        return `__object__:${id}`;
      }

romgrk

'use client';
import * as React from 'react';

const rows = 1000;
const effects = 100;

export default function Component() {
  return (
    <div>
      {Array.from({ length: rows }).map((_, i) => (

romgrk

import * as React from 'react';
import * as ReactDOM from 'react-dom';
import { ThemeProvider, createTheme } from '@mui/material/styles';
import CssBaseline from '@mui/material/CssBaseline';

const darkTheme = createTheme({
  palette: {
    mode: 'dark',
    background: {
      default: '#262626',

romgrk

import * as React from 'react';
import Paper from '@mui/material/Paper';
import Box from '@mui/material/Box';
import { ChartContainer } from '@mui/x-charts/ChartContainer';
import { BarPlot } from '@mui/x-charts/BarChart';
import { LinePlot, MarkPlot } from '@mui/x-charts/LineChart';
import { ChartsXAxis } from '@mui/x-charts/ChartsXAxis';

const lineData: number[] = [];
const barData: number[] = [];

romgrk

'use client';
import * as React from 'react';
import * as ReactDOM from 'react-dom';
import { Menu } from '@base-ui-components/react/menu';
import { Tooltip } from '@base-ui-components/react/tooltip';
import menuDemoStyles from './menu-styles.module.css';
import tooltipDemoStyles from './tooltip-styles.module.css';
import styles from './perf.module.css';

type RowData = {

romgrk

const items = Array.from({ length: 10_000 }, (_, i) => ({ valule: i + 1 }));

const BATCH_SIZE = 500;

async function incrementalFilter(
  items: any[],
  predicate: (item: any) => boolean,
  batchSize: number,
  onResult: (result: { items: any[]; filtered: number; done: boolean }) => void,
) {

romgrk

'use client';
import { useIsoLayoutEffect } from './useIsoLayoutEffect';
import { useRefWithInit } from './useRefWithInit';

export function usePreviousValue<T>(value: T) {
  const instance = useRefWithInit(createPreviousValue, value).current;

  instance.next = value;
  instance.dependencies[0] = value;

romgrk

node:internal/modules/customization_hooks:276
    throw new ERR_INVALID_RETURN_PROPERTY_VALUE(
          ^

TypeError [ERR_INVALID_RETURN_PROPERTY_VALUE]: Expected a string, an ArrayBuffer, or a TypedArray to be returned for the "source" from the "load" hook but got undefined.
    at validateLoad (node:internal/modules/customization_hooks:276:11)
    at nextStep (node:internal/modules/customization_hooks:190:14)
    at load (file:///project/workspace/tests/node-ignore-css.mjs:8:12)
    at nextStep (node:internal/modules/customization_hooks:185:26)
    at loadWithHooks (node:internal/modules/customization_hooks:348:18)

romgrk

$ yarn -v                                              
4.9.2
$ node -v          
v22.18.0
$ npm -v     
10.9.3
$ yarn add @mui/x-data-grid
➤ YN0000: · Yarn 4.9.2
➤ YN0000: ┌ Resolution step
➤ YN0085: │ + @mui/x-data-grid@npm:8.9.2, @babel/runtime@npm:7.28.2, @mui/types@npm:7.4.5, @mui/utils@npm:7.3.0, @mui/x-internals@npm:8.9.2, @mui/x-virtualizer@npm:0.1.0, @types/prop-types@npm:15.7.15, clsx@npm:2.1.1, and 8 more.

romgrk

import * as React from 'react';
import { ThemeProvider, createTheme } from '@mui/material/styles';
import { NoSsr, CssBaseline } from '@mui/material';
import '@mui/x-data-grid/themeAugmentation';

const theme = createTheme({
  palette: {
    mode: 'dark',
    background: {
      default: '#262626',