• Из-за обновления GTA 5 (был добавлен новый патч) может временно не работать вход в RAGE Multiplayer.

    Ошибка: Ваша версия Grand Theft Auto V не поддерживается RAGE Multiplayer.
    ERROR: Your game version is not supported by RAGE Multiplayer.

    Данная ошибка говорит о том, что GTA V обновилась до новой версии (GTA Online тоже). Вам необходимо обновить саму игру в главном меню вашего приложения (Steam / Epic Games / Rockstar Games).
    Если после этого RAGE:MP все равно не работает - вам нужно дождаться выхода патча для самого мультиплеера (обычно это занимает от нескольких часов до нескольких дней).

    Новости и апдейты Rockstar Games - https://www.rockstargames.com/newswire/
    Статус всех служб для Rockstar Games Launcher и поддерживаемых игр: https://support.rockstargames.com/ru/servicestatus


    Grand Theft Auto 5 (+ GTA Online) последний раз были обновлены:

Проблема Зависает React интерфейс

xtrasupra

Активный участник
FrontEnd developer
Designer
29 Сен 2022
128
40
85
Недавно сделал небольшой интерфейс для аренды т/с, вполне вышло неплохо учитывая что я сделал к нему дизайн, сверстал и подключил к серверу, меню вышло горизонтальное с небольшими функциями на фреймворке React (не особо разбираюсь в этой теме, не обессудьте), сделал а-ля горизонтальное скролл меню и дело в том что на локалке работает все отлично, но когда подключал к серверу произошло то что я не ожидал, скролл в игре очень зависает, не из-за того что мой пк слабый, а возможно не успевает рендерить анимацию и происходят лаги при скролле активных блоков, но все остальные анимации и тд работают плавно, с чем это может быть связано?
Если есть хороший Фронтер то отпишитесь в тг @behteev
За небольшую плату может поможете через демку, очень обидно ибо для моего уровня это действительно крутой интерфейс, не хотел бы закончить его так и не решив проблему.
 

Jerry (ChatGPT)

AI-powered language model
VIP
helper
17 Окт 2023
2,425
239
100
Возможно, проблема связана с перегрузкой браузера из-за большого количества активных блоков при скроллинге. Попробуйте оптимизировать код, уменьшить количество элементов, которые рендерятся на экране одновременно, или использовать виртуализацию списка для улучшения производительности. Также, можно проверить использование памяти и ресурсов браузера с помощью инструментов разработчика для выявления узких мест.

Если у вас возникли сложности с оптимизацией интерфейса на React, рекомендую обратиться за помощью к опытным фронтенд-разработчикам, которые смогут найти и исправить проблему. Возможно, на форуме или в специализированных сообществах вы найдете человека, который окажет вам помощь за вознаграждение. Удачи в решении проблемы с интерфейсом!
 

Vermilion

Высший разум
High developer
BackEnd developer
FrontEnd developer
29 Сен 2021
1,362
810
181
34
посмотреть хотя бы index.tsx
 

xtrasupra

Активный участник
FrontEnd developer
Designer
29 Сен 2022
128
40
85
посмотреть хотя бы index.tsx
У меня jsx разметка, а зачем сюда опен сурс заливать?
Да, может это важно, но я не хотел бы выкладывать сюда опен сурс, функций не так много и рендер должен адекватно обрабатываться, на локалке всё ок, не могу винить сервер и пк, только при активации меню скроллинг зависает, поэтому и хочу лс
 

Vermilion

Высший разум
High developer
BackEnd developer
FrontEnd developer
29 Сен 2021
1,362
810
181
34
У меня jsx разметка, а зачем сюда опен сурс заливать?
Да, может это важно, но я не хотел бы выкладывать сюда опен сурс, функций не так много и рендер должен адекватно обрабатываться, на локалке всё ок, не могу винить сервер и пк, только при активации меню скроллинг зависает, поэтому и хочу лс
Тогда можешь распечатать код на листе формата А4 и приложить к монитору, я попробую посмотреть. Но не обещаю, что получится помочь.
 

xtrasupra

Активный участник
FrontEnd developer
Designer
29 Сен 2022
128
40
85
Тогда можешь распечатать код на листе формата А4 и приложить к монитору, я попробую посмотреть. Но не обещаю, что получится помочь.
Я бы мог небольшой кусок кода анимации скролла добавить сюда, но я у не уверен что это поможем, поэтому у меня есть демка и есть денюжка на очень вкусную шавуху за 20-15 минут времени :)
 

Inoi

/dev/null
Команда форума
Moderator
VIP
15 Окт 2020
4,084
2,006
208
35
У меня jsx разметка, а зачем сюда опен сурс заливать?
Да, может это важно, но я не хотел бы выкладывать сюда опен сурс
мне кажется ты чуть чуть переоцениваешь важность и уникальность такой невероятной разработки, как меню на реакте
ещё и без ксс
 

xtrasupra

Активный участник
FrontEnd developer
Designer
29 Сен 2022
128
40
85
мне кажется ты чуть чуть переоцениваешь важность и уникальность такой невероятной разработки, как меню на реакте
ещё и без ксс
Может и да, но в любом случае я не хочу в этой теме открывать спор со всеми и так далее, мне просто необходим фронтер за небольшую оплату и всё, дело даже не в этом, я хочу поговорить с опытным человеком и выяснить причину
 

xtrasupra

Активный участник
FrontEnd developer
Designer
29 Сен 2022
128
40
85
ну ты хоть код компонента этого покажи, который типа карусель
Уже не за пк, пытался оптимизировать и переписывал код

Код:
const scrollToActiveTile = (instant = false) => {
    if (!containerRef.current) return;

    const container = containerRef.current;
    const tiles = container.children;

    if (tiles.length > activeIndex && tiles[activeIndex]) {
        const tile = tiles[activeIndex];
        const offsetLeft = tile.offsetLeft - container.offsetWidth / 2 + tile.offsetWidth / 2;
        container.scrollTo({
            left: offsetLeft,
            behavior: instant ? "auto" : "smooth",
        });
    }
};
 
Последнее редактирование:
  • Wow
Реакции: Inoi

Inoi

/dev/null
Команда форума
Moderator
VIP
15 Окт 2020
4,084
2,006
208
35
я не фронтендер особо, но на уровне моих знаний - твой код выглядит как наркомания
ты же сам пишешь что это реакт, там есть стейты всякие, пропсы

при этом

1737163222570.png


ты напрямую тыкаешь дом-элементы - это возможно нормально для чистого жс, но для реакта это буквально антипаттерн за каким-то очень редким исключением

1737163312272.png


это ручное вычисление оффсетов для сдвига, я правильно понимаю?
это же тоже пиздец
есть же ну библиотеки какие-то, есть ксс какой нибудь чуть более высокоуровневый, чего-то там скролл снэп - не уверен что это прям под твою задачу, но и под твою чуть более чем дохуя можно подобрать
каруселей этих как говна

из того что тут есть и может прям в данном примере так влиять на работу цефки - есть только behavior smooth, в теории
поставь auto, например

в остальном в твоём конкретном примере ничего такого, кроме того, что от реакта здесь только название
 
Последнее редактирование:
Реакции: MADARAdev и Vermilion

fivepkost

Активный участник
25 Мар 2023
271
38
65
JavaScript:
import React, { useRef } from 'react';

const ScrollableTileContainer = ({ activeIndex }) => {
    const containerRef = useRef(null);

    const scrollToActiveTile = (instant = false) => {
        if (!containerRef.current) return;

        const container = containerRef.current;
        const tiles = container.children;

        if (tiles.length > activeIndex && tiles[activeIndex]) {
            const tile = tiles[activeIndex];
            const offsetLeft = tile.offsetLeft - container.offsetWidth / 2 + tile.offsetWidth / 2;
            container.scrollTo({
                left: offsetLeft,
                behavior: instant ? "auto" : "smooth",
            });
        }
    };
 
Реакции: derrsak

xtrasupra

Активный участник
FrontEnd developer
Designer
29 Сен 2022
128
40
85
JavaScript:
import React, { useRef } from 'react';

const ScrollableTileContainer = ({ activeIndex }) => {
    const containerRef = useRef(null);

    const scrollToActiveTile = (instant = false) => {
        if (!containerRef.current) return;

        const container = containerRef.current;
        const tiles = container.children;

        if (tiles.length > activeIndex && tiles[activeIndex]) {
            const tile = tiles[activeIndex];
            const offsetLeft = tile.offsetLeft - container.offsetWidth / 2 + tile.offsetWidth / 2;
            container.scrollTo({
                left: offsetLeft,
                behavior: instant ? "auto" : "smooth",
            });
        }
    };
То есть тут теперь нету обновление компонента?
Просто интересно разобрать
 
Последнее редактирование:

fivepkost

Активный участник
25 Мар 2023
271
38
65
То есть тут теперь нету обновление компонента?
Просто интересно и разобрать
при перерисовке React вызывает функцию компонента заново, создавая новое представление, если activeIndex изменился, useEffect сработает и произойдет прокрутка к новой активной плитке, в данном случае компонент у нас ScrollableTileContainer

Screenshot_12.png
 
Последнее редактирование:
Реакции: Vermilion

kirillzver

Гуру
BackEnd developer
2 Ноя 2020
190
117
104
В рейджовском CEF некоторые моменты работают не так, как в обычном браузере.
Точно могу сказать, что интервалы вызываются не с такой интенсивностью, из-за градиента в SVG может подвисать интерфейс, также, подобное подвисание может вызвано открытым CEF-дебаггером.
Вот эта часть у тебя, часом, не SVG?
1737202280470.png
В любом случае, рекомендую перевести анимацию на CSS.
 

xtrasupra

Активный участник
FrontEnd developer
Designer
29 Сен 2022
128
40
85
В рейджовском CEF некоторые моменты работают не так, как в обычном браузере.
Точно могу сказать, что интервалы вызываются не с такой интенсивностью, из-за градиента в SVG может подвисать интерфейс, также, подобное подвисание может вызвано открытым CEF-дебаггером.
Вот эта часть у тебя, часом, не SVG?
В любом случае, рекомендую перевести анимацию на CSS.
Эта часть SVG но эта часть обычная статичная картинка, другая зеленая палочка это тоже SVG, предлагаете передать картинки на CSS?
 

Similar threads