Message communication is very slow after react native webview is packaged.

I use the webview component to open a page of a local vue project, and then pass reactnative the href address of through a click event of on that page, and reactnative opens the href page in the browser through linking .

The

problem is:
in the environment of developing and debugging react-native run-android , every time you click on the tag, you can quickly open the browser and load the page. However, after packaging cd android & & gradlew assembleRelease and installing app, each click on the tag requires a reaction time of more than 30s , and during this period, nothing can be done. I personally feel that js is blocked and baidu,google has checked it. Most of them are about the simple use of webview, but there is little information about webview"s false death, and there is nothing I can do about it.

the RN component code is as follows:

import React from "react";
import { View, Text, WebView, ToastAndroid, Linking } from "react-native";
import { connect } from "dva/mobile";
import { FullLoading } from "@/components/common";
import { container, bg } from "@/styles/base";
import { HomeHeader } from "@/components/layout/headers";

@connect(state=>({...state}))
class Information extends React.Component{
    static navigationOptions = HomeHeader;
    constructor(props){
        super(props);
        this.state={
            isLoading:false
        }
    }

    //
    onLoadStart(){
        this.setState({isLoading:true});
    }

    //
    onLoadEnd(){
        this.setState({isLoading:false});
    }

    //
    onHeaderRightClick(){
        let { hotwordList } = this.props.search;
        let name = !!hotwordList && !!hotwordList[0] && hotwordList[0].name || HOT_WORD;
        this.props.navigation.navigate({routeName:"Search", params:{hotword:name}})

    }

    //
    injectJavaScript(){
        return  `
            var oLink = document.getElementById("github-link");
            oLink.onclick = function(event){
                window.postMessage(this.href);
                event.preventDefault();
            }
        `
    }
    
    //
    onMessage(e){
        console.log(e)
        Linking.openURL(e.nativeEvent.data).catch(err => ToastAndroid.show("", 1000));
    }
    componentDidMount(){
        this.props.navigation.onHeaderRightClick = this.onHeaderRightClick.bind(this);
    }
    render(){
        // let baseUrl = "http://10.0.1.110:8080/about";
        let baseUrl = "file:///android_asset/web/index.html-sharp/about";
        return(
            <View style={[container.view_]}>
                {this.state.isLoading && <FullLoading type="center"/>}
                <WebView
                      onLoadStart={this.onLoadStart.bind(this)}
                      onLoadEnd={this.onLoadEnd.bind(this)}
                      style={{width:"100%", height:"100%", backgroundColor:"-sharpfff"}}
                    source={{
                        uri: baseUrl,
                        method: "GET"
                    }}
                    renderError={(e) => {
                        console.log(e, "renderError")
                        return <View><Text>renderError</Text></View>
                    }}

                    domStorageEnabled={true}
                    javaScriptEnabled={true}
                    mixedContentMode="always"
                     scalesPageToFit={true}
                     onMessage={this.onMessage.bind(this)}
                     injectedJavaScript={this.injectJavaScript()}
                />
            </View>
        )
    }
}
export default Information;

The code of

VUE project is as follows. After a tag is clicked, the message is sent to RN. After RN accepts it, the phone automatically opens the browser and jumps to the gay station:

<style src="../../assets/css/about/index.css" scoped></style>
<template>
    <div class="about">
        <div class="main">
            <div class="info-box">
                <div class="bg">
                    <Clock></Clock>
                </div>
                <div class="avatar">
                    <img src="../../assets/img/avatar.jpg">
                </div>
                <div class="describe">
                    <div class="name color-black font-20">
                        xxxxxxx
                    </div>
                    <div class="intr color-gray font-14 margin-top-5">
                        xxxxxxx
                    </div>
                </div>
                <div class="footer">
                    <a id="github-link" href="https://github.com" class="icon-github"></a>
                </div>
            </div>
        </div>
    </div>
</template>
<script>
    import Clock from "./clock.vue";
    export default{
        name:"about",
        components:{
            Clock
        }
    }
</script>

does Daniel know why?