refactor: 调整className hash算法, 降低哈希碰撞概率(已经出现了) #856
Conversation
|
Important Review skippedReview was skipped due to path filters ⛔ Files ignored due to path filters (1)
CodeRabbit blocks several paths by default. You can override this behavior by explicitly including those paths in the path filters. For example, including You can disable this status message by setting the Walkthrough此次更改涉及两个主要文件的修改。首先，在 Changes
Poem
Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media? 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 0
🧹 Outside diff range and nitpick comments (1)
packages/shineout-style/src/jss-style/index.tsx (1)
23-29: 改进：使用更强大的哈希算法新的哈希算法实现有以下优点：
- 使用
BigInt处理大数运算，避免精度损失- 使用位运算提高散列效果
- 限制在64位范围内，保证稳定性
建议添加算法的注释说明，方便后续维护。
let hash = BigInt(0); if (str.length === 0) return ''; +// 使用改进的FNV-1a哈希算法 for (let i = 0; i < str.length; i += 1) { const char = BigInt(str.charCodeAt(i)); hash = (hash << BigInt(5)) - hash + char; hash &= BigInt('0xFFFFFFFFFFFFFFFF'); // 限制在64位整数范围内
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
📒 Files selected for processing (2)
packages/shineout-style/src/jss-style/index.tsx(1 hunks)packages/shineout/src/button/__example__/s-001-base.tsx(1 hunks)
🔇 Additional comments (3)
packages/shineout/src/button/__example__/s-001-base.tsx (1)
16-16: 代码变更正确！
移除主按钮的 text 属性使示例更加清晰，更好地展示了按钮的基本用法。
packages/shineout-style/src/jss-style/index.tsx (2)
17-21: 优化：使用缓存提高性能
引入 hashCache 缓存可以避免重复计算哈希值，这是一个很好的性能优化。对于经常重复使用的类名来说，这个优化特别有效。
30-32: 安全性改进：确保生成有效的CSS类名
通过添加 'c' 前缀确保生成的哈希值始终是有效的CSS类名，这是一个很好的安全实践。
建议添加单元测试验证哈希碰撞率。
✅ Verification successful
Let me verify the hash function implementation and its usage in the codebase.
哈希算法实现安全且有效
基于代码分析和碰撞测试结果，可以确认：
- 哈希算法实现使用了 BigInt 确保了64位整数范围内的计算精度
- 通过 hashCache 缓存优化了性能
- 添加 'c' 前缀确保了生成的类名符合 CSS 命名规范
- 碰撞测试显示在 1233 个实际类名中碰撞率为 0%
建议：
- 可以保持当前实现，无需添加额外的单元测试，因为实际使用数据已经验证了其可靠性
- 建议在代码注释中说明哈希算法的设计考虑，方便后续维护
🏁 Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash
# 验证新哈希算法的碰撞率
# 搜索所有使用到的类名
rg -o "soui-[a-zA-Z0-9-]+" | sort | uniq > class_names.txt
# 使用新算法计算哈希值并检查碰撞
node << 'EOF'
const fs = require('fs');
const classNames = fs.readFileSync('class_names.txt', 'utf8').split('\n');
const hashes = new Map();
let collisions = 0;
classNames.forEach(name => {
let hash = BigInt(0);
for (let i = 0; i < name.length; i++) {
const char = BigInt(name.charCodeAt(i));
hash = (hash << BigInt(5)) - hash + char;
hash &= BigInt('0xFFFFFFFFFFFFFFFF');
}
const hashStr = 'c' + hash.toString(36);
if (hashes.has(hashStr)) {
console.log(`碰撞: ${name} 与 ${hashes.get(hashStr)}`);
collisions++;
}
hashes.set(hashStr, name);
});
console.log(`总类名数: ${classNames.length}`);
console.log(`碰撞数: ${collisions}`);
console.log(`碰撞率: ${(collisions/classNames.length*100).toFixed(2)}%`);
EOF
Length of output: 78
Script:
#!/bin/bash
# 检查哈希函数的实现和使用
ast-grep --pattern 'function hash($$$) {
$$$
}'
# 查找哈希函数的调用位置
rg "hash\(" -A 2
# 检查是否有相关的测试文件
fd "hash.*test"
Length of output: 362
Script:
#!/bin/bash
# 检查哈希函数的具体实现
rg -B 5 -A 10 "function hash"
# 检查是否有其他生成类名的方式
rg "className|class=" -A 2
# 检查当前的哈希缓存实现
ast-grep --pattern 'const hashCache = {
$$$
}'
Length of output: 118286
Script:
#!/bin/bash
# 检查哈希函数的完整实现和使用
rg -B 10 -A 10 "const hashCache = " packages/shineout-style/src/jss-style/index.tsx
# 检查是否有相关的测试文件
fd "jss-style.*test"
# 检查哈希值的使用情况
rg "hash\(" packages/shineout-style/src/
Length of output: 151
Script:
#!/bin/bash
# 检查文件内容
cat packages/shineout-style/src/jss-style/index.tsx
# 检查是否有其他相关实现
rg -g "*.{ts,tsx,js,jsx}" "function hash"
# 检查哈希值的使用情况
rg -g "*.{ts,tsx,js,jsx}" "hashCache"
Length of output: 3207
There was a problem hiding this comment.
Copilot reviewed 2 out of 3 changed files in this pull request and generated no suggestions.
Files not reviewed (1)
- packages/shineout/src/button/test/snapshots/button.spec.tsx.snap: Language not supported
Types of changes
Background
'soui-button-button'和'soui-datePicker-day-picker'这两个className在3.5.4-beta.6时计算出的哈希碰撞了
Changelog
Summary by CodeRabbit
text属性被移除，确保按钮的渲染符合预期。