可交互时间(Time to Interactive TTI)

+ 查看更多

可交互时间(Time to Interactive TTI) 是指从页面加载开始到主要资源加载完成，并且能够快速可靠地响应用户输入的这段时间。定义看起来很简单，但是计算TTI还是很复杂的。正确姿势如下:

1. 从首次渲染(FCP)开始；
2. 然后等啊等啊。等到连续5秒钟都没有进行任何长任务(时间超过50ms的任务)或者2个同时进行的GET请求；
3. 恭喜你，现在可以计算了。向后搜索之前的最后一个长任务，如果没有找到长任务就停止在FCP。
4. TTI就是最后一个长任务的结束时间(如果没有找到长任务，则与FCP相同)。

在过去，开发人员为了快速呈现时间而优化页面，有时不择手段的以牺牲TTI为代价。典型的现象就是，你能看到页面上的一些东西，但是啥都干不了，只能干等着。（其实鸽认为已经比啥都看不见干等着要好一些了）

服务器端呈现(SSR)等技术可能导致页面看起来是可交互的(也就是说，链接和按钮在屏幕上是可见的)，但它不是实际上交互。原因可能是主线程被阻塞了，或者是控制这些元素的JavaScript代码还没有加载。当用户试图操作一个看起来具有交互性但实际上没有交互性的页面，他们可能会:

• 在最好的情况下，他们会因为页面响应缓慢而烦恼。
• 在最坏的情况下，他们会认为这页纸坏了，很可能会离开。他们甚至可能对你的品牌价值失去信心或信任。

为了避免这个问题，尽量减少FCP和TTI之间的差异。在某些情况下，确实存在明显的差异，请通过可视化指示器清楚地表明页面上的组件还没有交互性。

好的TTI是多少?

Google官方认为，手机上，5秒是个不错的时间。但鸽认为，能短一些就尽量短一些。虎翼和起飞页，都能将其有效的控制在2秒甚至更短的时间内。