رسم نمودار google chart با ajax

سلام وقت بخیر
من داخل پنل مدیریت صفحه اول (پیشخوان) سامانه ای که طراحی کردم نمودار های مدیریتی وجود دارد که با google chart طراحی کردم ، برای رسم این نمودار ها محاسباتی روی داده های موجود انجام میشه که کمی زمانبر هست
از طرفی وجود این نمودار ها در صفحه پیشخوان الزامی است چطور میتونم زمان لود صفحه را کاهش بدم ؟
آیا از میشه از ajax استفاده کرد و متغیر های داخل اسکریپت رو مقدار داد ؟ اگر امکانش هست لطفا راهنمایی بفرمایید
یا امکانش هست فایل js مربوط به نمودار به طور کلی با ajax فراخوانی بشه ؟
ممنون میشم راهنمایی بفرمایید

<script type="text/javascript">
    google.charts.load('current', {'packages':['corechart', 'bar']});
    google.charts.setOnLoadCallback(drawStuff1);

    function drawStuff1() {

        var button = document.getElementById('change-chart');
        var chartDiv = document.getElementById('chart_div1');

        var data = google.visualization.arrayToDataTable([
            ['', 'مونتاژ','جوش','رنگ','فروش'],
            ['{{ $month[5]}}',  {{$weight_in_month_assemble[5]}},{{$weight_in_month_weld[5]}},{{$weight_in_month_color[5]}}, {{$sale_month[5]}}],
            ['{{ $month[4] }}',  {{$weight_in_month_assemble[4]}},{{$weight_in_month_weld[4]}},{{$weight_in_month_color[4]}}, {{$sale_month[4]}}],
            ['{{ $month[3] }}',  {{$weight_in_month_assemble[3]}},{{$weight_in_month_weld[3]}},{{$weight_in_month_color[3]}}, {{$sale_month[3]}}],
            ['{{ $month[2] }}', {{$weight_in_month_assemble[2]}},{{$weight_in_month_weld[2]}},{{$weight_in_month_color[2]}}, {{$sale_month[2]}}],
            ['{{ $month[1] }}', {{$weight_in_month_assemble[1]}},{{$weight_in_month_weld[1]}},{{$weight_in_month_color[1]}}, {{$sale_month[1]}}],
            ['{{ $month[0] }}', {{$weight_in_month_assemble[0]}},{{$weight_in_month_weld[0]}},{{$weight_in_month_color[0]}}, {{$sale_month[0]}}]
        ]);

        var materialOptions = {
            bar: { groupWidth: "100%"},
            colors: ['#00c0ef','#DD4B39','#F39C12','#00A65A'],

            vAxis:
                {
                    title : '',
                    textStyle:
                        {
                            color: '#454545',
                            fontName: 'Vazir',
                            fontSize: 13
                        }
                },
            hAxis:
                {
                    textStyle:
                        {
                            color: '#454545',
                            fontName: 'Vazir',
                            fontSize: 13
                        }
                },
            legend: {
                position: 'right',
                maxLines: 3,
                textStyle: {
                    color: '#2a292e',
                    fontName: 'Vazir',
                    fontSize: 13,
                },

            },
            chart: {
                title: '',
                subtitle: ''
            },
        };

        function drawMaterialChart() {
            var materialChart = new google.charts.Bar(chartDiv);
            materialChart.draw(data, google.charts.Bar.convertOptions(materialOptions));
            button.innerText = 'Change to Classic';
            button.onclick = drawClassicChart;
        }
<script>