AJAX（Asynchronous JavaScript and XML）是一种常用的前端技术，可以实现异步数据交互，提升用户体验。在Vue.js中，我们可以使用AJAX在mounted生命周期钩子函数中发起请求。使用AJAX的好处是可以在页面加载完成后，再去获取并更新页面中的数据，而不会阻塞其他页面元素的加载。这种方式可以避免页面卡顿或加载速度过慢的问题，提升了用户体验。

举例来说明，假设我们有一个电子商务网站，需要在页面加载后通过AJAX请求获取商品数据并将其展示出来。如果在页面加载前就发起请求，那么用户在浏览页面时会感到明显的卡顿。而通过在mounted生命周期函数中发起请求，可以先显示一些基本的页面内容，然后在后台请求数据，并在数据返回后动态更新页面，让用户有更好的体验。

<template>
<div>
<div>商品列表：</div>
<ul>
<li v-for="item in items" :key="item.id">
{{ item.name }}
</li>
</ul>
</div>
</template>
<script>
export default {
data() {
return {
items: []
};
},
mounted() {
// 发起AJAX请求获取商品数据
this.fetchItems();
},
methods: {
fetchItems() {
// 使用AJAX获取商品数据
// ...
// 将获取到的数据更新到this.items中
}
}
};
</script>

通过以上代码片段可以看出，在Vue.js组件中可以使用AJAX请求数据，并通过更新数据的方式动态更新页面。这样，当页面加载完成后，用户可以先看到基本内容，而不用等待数据加载完成。

另一个需要注意的方面是，AJAX请求是异步的，即请求发送后，页面会继续往下加载，而不会等待请求的返回。这可以显著提升页面的加载速度。假如我们在mounted函数中有多个AJAX请求，那么这些请求将会同时发送，并在数据返回后分别更新相应的组件数据。

<script>
export default {
data() {
return {
items1: [],
items2: []
};
},
mounted() {
this.fetchItems1();
this.fetchItems2();
},
methods: {
fetchItems1() {
// 使用AJAX获取商品数据1
// ...
// 将获取到的数据更新到this.items1中
},
fetchItems2() {
// 使用AJAX获取商品数据2
// ...
// 将获取到的数据更新到this.items2中
}
}
};
</script>

以上代码展示了在mounted函数中同时发送两个AJAX请求的情况。这两个请求在页面加载后会同时发送，并在数据返回后更新相应的组件数据。这种设计可以提升页面的加载速度，并且不会阻塞其他资源的加载。

综上所述，通过在mounted生命周期钩子函数中使用AJAX请求数据，可以实现页面的异步更新，提升用户体验。这种方式在页面加载完成后再去获取数据，可避免页面卡顿或加载速度过慢的问题。同时，AJAX请求的异步特性，使得多个请求可以同时发送，并在数据返回后分别更新相应的组件数据。