Very slow response if there is an error in laravel view or component with inline javascript

I'm new to laravel and I'm building a pure laravel 9 app(no vue, nodejs or other frameworks just laravel + vanilla js). If I have any kind of error (even a typo like ech 'a letter is missing'; ) in a laravel child view or component, the error page response tooks more then 20seconds to appears. After investigating this for an entire day, I found that the time of response is proportionate to the length of the inline javascript code present in the blade.php file. In example if I have an inline console log with a lot of text(just for simulation) the more the text is long the more time the page error will takes to respond. If I place the js in an external script or in the layout.blade.php root file, the error page will load superfast. I know that inline script is a bad practice, especially in this case that we are talking about 500 rows of pure JS, but in some conditions this is my way to work and take things ordered, so I want to fix this.

UPDATE:

I forgot to specify that if no errors are present, the page will load superfast under 100ms

HERE THERE IS A SCREEN OF MY INSPECTOR

THIS IS THE RELATED CONTROLLER

class DisponibilitaController extends Controller
{

    // Show dashboard disponibilità
    public function index(request $request){

        $fields = [
            'status' => 'STATO',
            'reference' => 'REFERENCE',
            'option_date' => 'OPTION DATE',
            'departure_port' => 'DA',
            'arrival_port' => 'A',
            'departure_date' => 'DATA PARTENZA',
            'arrival_date' => 'DATA ARRIVO',
            'season' => 'STAGIONALITÀ',
            'notes' => 'APPUNTI',
            'accomodations' => 'SISTEMAZIONI',
            'vehicles' => 'VEICOLI',
            'name' => 'NOME',
            'surname' => 'COGNOME'
        ];
        
        return view('disponibilita.dashboard',

            [
            "title" => "Gestione disponibilita",
            "id" => "disponibilitaTable",
            "thead" => array_values($fields),
            "data" => Disponibilita::latest()->paginate(3, array_keys($fields)),
            "theadhelpers" => '
                <input type="checkbox" id="select-all">
                <i class="fa-solid fa-reply-all"></i>',
            "tbodyhelpers" => '
                    <input type="checkbox" class="select-row">
                    <i class="fa-solid fa-lock lock"></i>
                    <i class="fa-solid fa-pencil edit"></i>
                    <i class="fa-solid fa-circle-minus delete"></i>
                    <i class="fa-solid fa-maximize maximize"></i>'
            ]
            
        );

    }
........

THIS IS THE MAIN LAYOUT BLADE

<!DOCTYPE html>
<html lang="en">
@include("partials._head")
<body>
    <div class="page">
        @include("partials._sidebar")
        <div class="content">
            <header>
                <h1>{{ucfirst($title)}}</h1>
            </header>
            @yield('content')
        </div>
    </div>
    @include("partials._footer")
    @stack('scripts')
</body>
</html>

AND THIS IS THE CHILD VIEW THAT I'M CALLING IN THE CONTROLLER WITH A TYPO ERROR AT THE BEGINNING

@php
ech 'missing a letter';
@endphp
@extends('layouts.layout')
@section('content')

@if (session('message'))
    <x-alert>{{ session('message') }}</x-alert>
@endif

<div class="dispo-list listings fadeInBottom">
    <div class="helper-bar">
        <div class="bulk-buttons">
            <x-button href="#" icon="plus" class="create">Aggiungi Disponibilità</x-button>
            <x-button href="#" icon="plus" class="">OPTION DATE</x-button>
            <x-button href="#" icon="plus" class="">BLOCCA</x-button>
            <x-button href="#" icon="plus" class="">CANCELLA</x-button>
            <x-button href="#" icon="plus" class="">EMETTI</x-button>
        </div>
        <div class="filter-dispo-ctn">
            <form id="filters-form" autocomplete="off">
                @csrf
                <div class="filters-ctn">
                    <div class="filter-ctn text-search">
                        <input id="text-search" type="text" name="text-search" value="" placeholder="Cerca per testo">
                    </div>
                    <div class="filter-group date-search">
                        <div class="filter-ctn date-from-search">
                            <input id="date-from-search" type="text" name="date-from-search" value="" placeholder="Partenze dal">
                        </div>
                        <div class="filter-ctn date-to-search">
                            <input id="date-to-search" type="text" name="date-to-search" value="" placeholder="Fino al">
                        </div>
                    </div>
                </div>
            </form>
        </div>
    </div>
    <x-table :id="$id" :thead="$thead" :theadhelpers="$theadhelpers" :tbodyhelpers="$tbodyhelpers" :data="$data" tfoot />
</div>
@endsection

@pushOnce('scripts')
<script>

/**
 *  Here the more inline javascript I place, the more laravel error page will take to
 *  respond, this is not related to what kind of functions I'm running but to 
 *  how much plain text I'm writing, so even a console.log with 300 words
 *  will add 30 seconds of delay to respond 
*/

console.log("here I place a very long text around 300words to got 30 seconds delay................")

</script>
@endPushOnce