Я создаю собственную карту реакции, используя MapView из 'react-native-maps' и этот механизм кластеризации маркеров . Это компонент кластерного маркера, который отлично работает с невероятной производительностью:
export default class ClusterMarker extends PureComponent {
constructor(props) {
super(props)
this.state = {
tracksViewChanges: true
}
}
UNSAFE_componentWillReceiveProps(nextProps) {
if (this.props !== nextProps) {
this.setState(() => ({
tracksViewChanges: true,
}))
}
}
componentDidUpdate() {
if (this.state.tracksViewChanges) {
this.setState(() => ({
tracksViewChanges: false,
}))
}
}
render() {
/*...
bunch of unrelated code where 'message', 'image', 'coordinate' and 'pointCount' are set
...*/
return (
<Marker
anchor={{x:0.5,y:0.5}}
centerOffset={{x:0.5,y:0.5}}
coordinate={coordinate}
image={image}
title={pointCount}
description={message}
tracksViewChanges={this.state.tracksViewChanges}>
{/* <Text>{pointCount}</Text> */} <-------- I want this to work just as fast
</Marker>
)
}
}
Видите это title={pointCount} в свойствах Marker? Когда пользователь щелкает кластер, появляется всплывающее окно, показывающее, сколько контактов находится в кластере. Я хочу вывести этот текст оттуда и отобразить его над кластером. Обратите внимание, что при рендеринге внутри маркера есть закомментированная строка. Без комментариев визуально он делает почти то, что нужно, но с ужасной производительностью на телефоне (1 кадр / с было бы преувеличением).
Понятно, что проблема в тексте. Моя гипотеза заключается в том, что компонент Text продолжает проверять родительский элемент, есть ли обновления в тексте, или что он все время повторно отображает без причины. Вот список вещей, которые я пытался исправить:
- Создайте компонент, расширяющийся от Text, выполняя ту же задачу без необычных обновлений или повторных рендеров. Нет увеличения fps.
- Создайте компонент, который отображает текст, но никогда не обновляет и не перерисовывает без причины. Без увеличения fps.
- Добавьте
tracksViewChanges logi c, которое вы видите выше. Это было в некоторой степени успехом, увеличив средний fps с 1 до 5. - Используйте другие библиотеки кластеризации маркеров (все они не работали с приличной производительностью даже без текста внутри маркера).
- Множество хакерских решений от inte rnet, ни одно из которых на самом деле не улучшило производительность.
Эта карта в настоящее время имеет дело в среднем с 20 000 контактов, и решение должно быть эффективным по мере увеличения этого количества контактов, потому что будет.
Я был бы очень рад, если бы кто-нибудь мог помочь!