CSDN 潜水
  • 33发帖数
  • 33主题数
  • 0关注数
  • 0粉丝
开启左侧

“请解释一下Twitter的前10行源代码”

[复制链接]
 楼主| CSDN 发表于 2022-5-5 12:34:20 | 显示全部楼层 |阅读模式 打印 上一主题 下一主题

作者 | Anand Chowdhary 译者 | 弯月
出品 | CSDN(ID:CSDNnews)
最近,我在为公司雇用一名高级全栈JavaScript工程师。由于我们是远程工作,因此面试在Zoom上举行,而且我留意到一些开发人员非常适合这份工作,却不擅长在白板上编写程序。以是,我们采取了一小时技术交流的方式,我提出有关Web指标、可访问性、欣赏器之战,以及其他有关Web的题目。每次我都要问的一个题目是:“请解释一下Twitter的网页源代码前10行。”

我认为,这是一个很简单的测试,但能检验出候选人对于前端基础知识把握的深度。

面试时,我会共享我的屏幕,打开Twitter.com并点击“查看源代码”。然后,我会让他们逐行解释HTML代码,至于解释的深度由他们自行决定。我还会放大屏幕,这样候选人看不到每一行完备的代码,但能大致了解代码的意思。如下所示:


                               
登录/注册后可看大图

请留意,我们的技术讨论只是一次对话,以是我并不会期待完善的答案。如果我听到一些正确的关键字,我就知道候选人了解这个概念,然后我会朝着正确的方向引导他们。



                               
登录/注册后可看大图

第一行:



网页源代码的第一行非常适合这类面试,由于候选人对于DOCTYPE的了解水平根本上能反映出他们的经验。我还记得当年Dreamweaver流行的时间,必要编写一串XHTML DOCTYPE,就像2009年Chris在文章《The Common DOCTYPES》中列出的一样(https://css-tricks.com/snippets/html/the-common-doctypes/)。

最佳答案:这一行是文档类型界说,所有HTML文件的第一行必须这么写。有人可能会认为这行代码是多余的,由于欣赏器已经知道响应的MIME类型是text/html,但在Netscape和Internet Explorer的期间,有许多不同的HTML标准,因此欣赏器很难判断应该遵照哪个标准来渲染页面。

这一点非常烦人,由于每个标准都会生成不同的布局,这才必要使用这个标签,帮助欣赏器举行渲染。从前,DOCTYPE非常长,而且还会包含标准的连接(就像本日的SVG文件那样),但幸运的是,这种简洁的成为了HTML 5的标准,并连续至今。

可以接受的答案:这是DOCTYPE标签,让欣赏器知道这是一个HTML 5网页,并应按照HTML 5渲染。




                               
登录/注册后可看大图

第二行:



这一行可以判断出候选人是否了解可访问性和本地化。令人惊讶的是,我面试过的人中很少有人知道dir属性,但这个属性能引发有关屏幕阅读器的讨论。险些每个人都能判断出lang="en"属性的含义,纵然他们从未用过。

最佳答案:这是HTML文档的根元素,其他元素都位于该元素之内。它有两个属性:方向和语言。方向属性的值为“从左到右”,告诉用户代理内容的方向;这个值也可以是“从右到左”,好比阿拉伯语;或者是“auto”,让欣赏器自行判断方向。

lang(语言)属性指明白该标签内的所有代码都是英语。你可以将这个值设置成任何语言标签,甚至可以区分en-us和en-gb。它也可以帮助屏幕阅读器判断该用哪种语言来读出笔墨。



                               
登录/注册后可看大图

第三行:



最佳答案:源代码中的meta标签为文档提供了元数据。字符集(charset)属性告诉欣赏器该使用哪种字符编码,Twitter使用的是标准的UTF-8编码。UTF-8非常好,由于它包含了许多字符点,因此可以在源代码中使用各种符号,甚至是心情符号。将这个标签放在文档开头非常紧张,保证欣赏器在碰到该标签时不至于已开始解析太多文本。我记得规则是要放在文档开头1k字节内,但我认为最佳实践是放在的第一行。

另外,似乎Twitter出于性能原因省略了标签(以减少加载的代码量),但我依然认为应当明确地写出,由于是容纳元信息、样式等的容器。




                               
登录/注册后可看大图

<strong><span >第四行:

精彩评论12

哥们就是这样的汉子 发表于 2022-5-5 13:45:10 | 显示全部楼层
转发了
理财之友一创造价值 发表于 2022-5-5 14:08:57 | 显示全部楼层
转发了
Youka2017 发表于 2022-5-5 14:51:46 | 显示全部楼层
面试概念的都是垃圾公司
sg小龙 发表于 2022-5-5 17:10:24 | 显示全部楼层
转发了
村里小能手 发表于 2022-5-5 17:37:44 | 显示全部楼层
html是markup language,什么都是在明面上的,还需要什么解释?读出来翻译一下就得了。
机器人9号s 发表于 2022-5-5 19:34:20 | 显示全部楼层
只会javascript还叫全栈啊[流泪]
杜雨 发表于 2022-5-5 23:51:32 | 显示全部楼层
转发了
kaos 发表于 2022-5-6 06:40:18 | 显示全部楼层
感觉这样招聘,极有可能招聘到一个理论派的“老师”,实际干活能力?
Mr树洞君 发表于 2022-5-6 08:15:59 | 显示全部楼层
请问什么样的工作需求要用到这前十行基础功底知识?
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

猜你喜欢
在线客服QQ
2241998733

24x7小时免费咨询

Powered by 创意电子 ©2018-现在 专注资源实战分享源码下载站联盟商城繁体中文