极客观点
项目管理
HarmonyOS
问题描述
在写transition动画的时候无意间发现有时候页面会卡死，查看任务管理器Chrome内存突然飙升，经过各种排除发现设置了transform:skew(90deg);的时候只要连续在相关transition动画元素上多次移入移出就会出现页面卡死的问题。这个是什么原因导致，还是说就是一个bug
简化后代码如下
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style>
div {
width: 500px;
height: 500px;
background: #aaa;
}
div p {
transition: all 0.35s;
transform:skew(0deg);
}
div:hover p {
transform:skew(90deg);
}
</style>
</head>
<body>
<div>
<p>连续移入移出导致卡死Debug</p>
</div>
</body>
</html>稳定复现方法及其他
连续移入移出就会导致卡死内存飙升的现象
另外经过多次测试只有transform:skew(90deg);属性，只有度数为90度的时候，只有Chrome有这个问题**
补充：Chrome版本是63.0.3239.132（正式版本） （64 位）
html5
版本 65.0.3315.3（正式版本）dev （64 位） ， Ubuntu 16.04
没有你说的问题。