AirJD 焦点
AirJD

没有录音文件
00:00/00:00
加收藏

CSS Checker 检查你的CSS语法错误 by Michael[tm] Smith

发布者 csser
发布于 1442278750833  浏览 2669 关键词 CSS, Node.JS, 开源, English 
分享到

第1页

W3C CSS Checker The Next Generation



第2页

Michael[tm] Smith W3C Deputy Director mike@w3.org http://people.w3.org/mike/



第3页

Question: Why check your CSS?



第4页

Answer: To catch mistakes.



第5页

Catch mistakes in your CSS

● Catch syntax errors ● Catch typos in CSS property names ● Catch values with the wrong datatype



第6页

Example…



第7页

There are three mistakes in the following example…



第8页

.ok { color: green; font-size: bold;

.alert { color: red background-color: white; font-size: bold;

}



第9页

.ok { color: green; font-weight: bold;

} .alert {

color: red; background-color: white; font-size: 150%; }



第10页

How to catch mistakes



第11页

Now: W3C CSS Validator



第12页

https://jigsaw.w3.org/css-validator



第14页

Problems with CSS Validator

● Very old; started in 2002 ● Not actively maintained any more ● Written in Java ● Hard to extend with new CSS properties



第15页

More Problems with CSS Validator

● Uses ad-hoc parser that doesn’t conform to CSS Syntax spec



第16页

So let’s make a new CSS Checker!



第17页

https://csschecker.w3.org



第18页

That URL doesn’t exist yet…



第19页

…but we are already at github



第20页

https://github.com/w3c/css-checker



第22页

New CSS Checker requirements

● Use a CSS parser that conforms to the CSS Syntax spec.

● Use the right programming language. ● Make it easy to extend.



第23页

What language to use?



第24页

JavaScript + node.js?



第25页

Tab Atkins CSS parser written in JavaScript



第26页

https://github.com/tabatkins/parse-css



第28页

Simon Sapin CSS parser written in Rust



第29页

https://github.com/servo/rust-cssparser



第30页

What is Rust?



第32页

Rust is the language that Mozilla Servo is written in



第33页

What is Mozilla Servo?



第34页

Servo is Mozilla’s next-generation browser engine



第35页

Simon Sapin’s rust-css-parser is the CSS parser used in Servo



第36页

For the CSS Checker, we could use the same CSS parser as a

major browser engine



第37页

Next-generation browser engine, next-generation CSS Checker



第38页

Advantages of Rust

● New, modern language (2010~) ● Pure functional ● High-concurrency/parallelization (to take

full advantage of multi-core CPUs)



第39页

Let me know what you think of using Rust for the nextgeneration CSS Checker!



第40页

Thanks!



支持文件格式:*.ppt, *.pptx, *.pdf
上传最后阶段需要进行在线转换,可能需要1~2分钟,请耐心等待。