Touching controlcomponents to show and hide control has a long delay

[tmKnight01]

Hello, I am very happy to be able to use such a great component, but I encountered a problem on the Android side. When I touch the video to show and hide the controls, the delay reaches more than 10s. I read the source code, but I don’t know what happened What.

 import React from 'react';
import {
  View,
  StyleSheet,
  Image,

} from 'react-native';
import {AssetItem} from '@/services/api';
import {isEmpty, get} from 'lodash-es';
import VideoPlayer from 'react-native-media-console';
import pxToDp from 'utils/pxToDp';

interface ItemProps {
  item: AssetItem;
}

function RenderItem({item}: ItemProps) {
  const isStartsWithHttp = (str: string) => str.startsWith('http');
  if (isEmpty(item)) return null;

  if ((get(item?.t?.split('/'), '[0]', '') as string) == 'video')
    return (
      <View style={{width: pxToDp(300), height: pxToDp(250)}}>
        <VideoPlayer
          disableBack
          repeat
          showOnStart
          source={{uri: 'https://media.w3.org/2010/05/sintel/trailer.mp4'}}
        />
      </View>
    );

  if ((get(item?.t?.split('/'), '[0]', '') as string) == 'image') {
    if (isStartsWithHttp(item?.b)) {
      return (
        <Image
          onError={e => console.log(e.nativeEvent.error)}
          style={CSS.itemBox}
          source={{uri: item?.b}}
        />
      );
    }
    return (
      <Image
        style={CSS.itemBox}
        onError={e => console.log(e.nativeEvent.error)}
        source={{uri: 'data:image/png;base64,' + item?.b}}
      />
    );
  }
}

const CSS = StyleSheet.create({
  itemBox: {
    width: pxToDp(200),
    height: pxToDp(150),
    marginTop: pxToDp(40),
  },
});

export default RenderItem;

it`s my code pls help me - -

[LunatiqueCoder]

Hello @tmKnight01

Unfortunately, we cannot reproduce it on our side and if we copy paste your code of course it won't work. I suggest you create a reproduction repository, that way you'll definitely receive help faster. Start a fresh react-native project by using npx react-native init in your terminal and see if the problem persists. If you cannot reproduce it on a new project, perhaps there are some issues in a parent component that's using the videoplayer?

Also, did you try the react-native-video alpha version 6? We're using that in production, since v5 has a lot of issues.

Note: react-native-video is in a pretty bad shape right now, our clients are considering to move toexpo-av, and thus a new videoplayer will be required.

[LunatiqueCoder]

Closing for now. Will be reopened if needed.