React-Mapbox-GL резко замедляет все приложение - PullRequest
Новая
       13

React-Mapbox-GL резко замедляет все приложение

0 голосов
/ 24 марта 2019

Я пытаюсь создать приложение, используя ReactJS и React-Mapbox-GL.

У меня есть один компонент, который имеет некоторый контент, который имеет анимацию набора текста с использованием response-typing-animation.

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

У меня нет ошибок, только (в основном) предупреждения о превышении времени ожидания,Снимок экрана ниже.

Console Errors

Я искал в Google несколько часов, но, к сожалению, ничего не нашел.Приведенный ниже код предоставлен страницей установки response-mapbox-gl npm.

Компонент MapSection 

import React, { Component } from 'react';
import ReactMapboxGl, { Layer, Feature } from "react-mapbox-gl";
const Map = ReactMapboxGl({
    accessToken: "myaccesstoken"
  });



export class MapSection extends Component {


    render() {

        return( 
            <div>
                <Map
                style="mapbox://styles/mapbox/streets-v9"
                containerStyle={{
                    height: "100vh",
                    width: "100vh"
                }}>
                    <Layer
                    type="symbol"
                    id="marker"
                    layout={{ "icon-image": "marker-15" }}>
                    <Feature coordinates={[-0.481747846041145, 51.3233379650232]}/>
                    </Layer>
                </Map>
            </div>
        );
    }
}

Ожидается, что карта будет работать (что она вроде как делает), но не замедляет мойПриложение (и браузер) до уровня улитки.

* ОБНОВЛЕНИЕ * Когда я вынимаю свой анимированный компонент набора текста, карта работает нормально.Так что это как-то конфликтует с анимацией реакции-набора текста и ломает приложение

...