탐색 실험에 고르지 않은 전환이 발생했습니다.

Question

RN 0.33 및 NavigationExperimental을 사용하여 부드러운 전환 효과를 얻지 못했습니다. 문제는 렌더링 된 장면이 렌더링하는 데 상대적으로 비용이 많이 들고 NavigationExperimental이 장면 전환을 위해 두 장면을 모두 유지한다는 것입니다. 이 프로세스를 최적화하기위한 좋은 전략이 무엇인지 궁금합니다.

지금까지 내가 수행 한 작업은 장면 구성 요소에 shouldComponentUpdate를 false로 설정하는 탐색 구성 요소의 'isAnimating'상태입니다.

Answer 1

이 문제가 발생했으며 전환시 누락 된 프레임은 데이터 가져 오기와 내가 전환하려고했던 구성 요소의 componentDidMount에서의 후속 렌더링으로 인해 발생했습니다.

componentDidMount에서 InteractionManager를 사용하면 가져 오기 코드가 애니메이션이나 전환이 완료된 후에 만 ​​실행될 수 있습니다. 예를 들어

:

import { InteractionManager } from 'react-native' 

    componentDidMount() { 
    this.interaction = InteractionManager.runAfterInteractions(() => {   
     performExpensiveFetch() 
    }) 
    } 

    componentWillUnmount() { 
    if(this.interaction) this.interaction.cancel() 
    }