How can we send constant stream of images to react-native app and constantly update image source?

Hey I'm trying to stream image data sent by server to display on the app.Here is my code:

import React,{useState} from 'react';
import { StyleSheet, Text, View, Image } from 'react-native';

export default function App() {
  var socket = new WebSocket('ws://192.168.1.110:8000/ws/stream/')
        const[image,useImage]=useState('');
        socket.onmessage = function(event){

            //console.log('Connected!', event.data)
            var blob = event.data;
            var reader = new FileReader();
             reader.readAsDataURL(blob); 
             reader.onloadend = function() {
                var base64data = reader.result;    
                var base = base64data.split(',')[1];            
                console.log(base64data);
                useImage( `data:image/jpeg;base64,${base}`);
             }
        }
  return (
    <View style={styles.container}>
      <Image source={image}/>
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  },
});

But this wont display the image stream. I'm very new to react-native and any help would be appreciated.