perf[ThemePicker]: refine updateStyle function (#554)

* theme replacing should cut tons of irrelevant css
This commit is contained in:
WangXinhai 2019-02-25 17:29:58 +08:00 committed by 花裤衩
parent 2e89ef444b
commit 6b88c41ffc
1 changed files with 10 additions and 3 deletions

View File

@ -67,11 +67,18 @@ export default {
methods: { methods: {
updateStyle(style, oldCluster, newCluster) { updateStyle(style, oldCluster, newCluster) {
let newStyle = style const colorOverrides = [] // only capture color overides
oldCluster.forEach((color, index) => { oldCluster.forEach((color, index) => {
newStyle = newStyle.replace(new RegExp(color, 'ig'), newCluster[index]) const value = newCluster[index]
const color_plain = color.replace(/([()])/g, '\\$1')
const repl = new RegExp(`(^|})([^{]+{[^{}]+)${color_plain}\\b([^}]*)(?=})`, 'gi')
const nestRepl = new RegExp(color_plain, 'ig') // for greed matching before the 'color'
let v
while ((v = repl.exec(style))) {
colorOverrides.push(v[2].replace(nestRepl, value) + value + v[3] + '}') // '}' not captured in the regexp repl to reserve it as locator-boundary
}
}) })
return newStyle return colorOverrides.join('')
}, },
getCSSString(url, callback, variable) { getCSSString(url, callback, variable) {