Мобильная версияЯ работаю над проектом, в котором мне хотелось бы иметь возможность отображать гигантский шахматный узор на компоненте веб-страницы. Он будет иметь переменный размер, но, вероятно, не более 100x100 ячеек, и каждая ячейка будет квадратом со стороной 100 пикселей.
Вот изображение, показывающее, чего я хочу:
Не беспокойтесь о границах/фоне, мне просто нужно оптимизировать эти квадратики.
В настоящее время я использую с элементами следующим образом:
{Array.from({length: CanvasSize}, (_, c) => { return Array.from({ length: CanvasSize}, (_, r) => { возвращаться ( ); }); })} Я боюсь, что для больших сеток это будет работать медленно. Есть ли более быстрый способ реализовать это? Было бы здорово, если бы я мог управлять событиями наведения/щелчка, например, яркостью ячеек, на которые наведен курсор, сохранением состояния выбранных ячеек и т. д.
Я использую React, если это полезная информация, хотя в любом случае это будет в основном HTML (если нет более быстрого способа)
Изменить: осмотревшись, я также нашел решение, использующее и — будет ли это быстрее, чем svg?
