General Questions:Front-end Developer Interview Questions

简介: What did you learn yesterday/this week?Learning Angular.What excites or interests you about coding?CoolReduce the boring & repeating worksThe...

What did you learn yesterday/this week?

Learning Angular.

What excites or interests you about coding?

  • Cool
  • Reduce the boring & repeating works
  • The learning process is happiness

What UI, Security, Performance, SEO, Maintainability or Technology considerations do you make while building a web application or site?

So big question...

Talk about your preferred development environment. (OS, Editor, Browsers, Tools etc.)

  • win/Unix(Mac OS)
  • sublime text 2/3, visual studio,vi
  • chrome/firefox/ie9
  • browsers devTools,git,node

Can you describe your workflow when you create a web page?

  • study prototype
  • set structures(html tag)
  • render with style
  • add interactive by scripts

Can you describe the difference between progressive enhancement and graceful degradation?

Bonus points for describing feature detection

Graceful degradation

Providing an alternative version of your functionality or making the user aware of shortcomings of a product as a safety measure to ensure that the product is usable.

Progressive enhancement

Starting with a baseline of usable functionality, then increasing the richness of the user experience step by step by testing for support for enhancements before applying them.

I agree with progressive enhancement, and increaseing user experience with feature detection.For example,once i detectived that the browser support round-corner or shadow text,i will apply the futures to pages.

Explain what "Semantic HTML" means.

Semantic HTML is the use of HTML markup to reinforce the semantics, or meaning, of the information in webpages rather than merely to define its presentation or look. Semantic HTML is processed by regular web browsers as well as by many other user agents. CSS is used to suggest its presentation to human users.

As an example, recent HTML standards discourage use of the tag <i> (italic, a typeface)[1] in preference of more accurate tags such as <em> (emphasis); the CSS stylesheet should then specify whether emphasis is denoted by an italic font, a bold font, underlining, slower or louder audible speech etc. This is because italics are used for purposes other than emphasis, such as citing a source; for this, HTML 4 provides the tag <cite>.[2] Another use for italics is foreign phrases or loanwords; web designers may use built-in XHTML language attributes[3] or specify their own semantic markup by choosing appropriate names for the class attribute values of HTML elements (e.g. class="loanword"). Marking emphasis, citations and loanwords in different ways makes it easier for web agents such as search engines and other software to ascertain the significance of the text.

Semantic = Meaning.

Semantic elements = Elements with meaning.

How to write 'Semantic HTML'?

  • write correct tags
  • Semantics applies to IDs and Classnames as well as tags
  • html first, then css
  • always separate style from content

How would you optimize a websites assets/resources?

Looking for a number of solutions which can include:

  • File concatenation
  • File minification
  • CDN Hosted
  • Caching
  • ...

Why is it better to serve site assets from multiple domains?

How many resources will a browser download from a given domain at a time?

Multiple domains could increase the number of parallel downloads that the browser can perform.

about 4 to 6 connections per domain

Not all browsers are restricted to just two parallel downloads per hostname. Opera 9+ and Safari 3+ do four downloads per hostname. Internet Explorer 8, Firefox 3, and Chrome 1+ do six downloads per hostname. Sharding across two domains is a good compromise that improves performance in all browsers.

The optimal number of domains to shard across is 2-4. After 4 domains, response time degrades.

Name 3 ways to decrease page load. (perceived or actual load time)

  • Reduce the number of requests
  • Minimize HTTP Requests
    • optimize images
    • minify css&js file
    • compress(gzip)
  • yahoo 14 rules

If you jumped on a project and they used tabs and you used spaces, what would you do?

  • Suggest the project utilize something like EditorConfig (http://editorconfig.org)
  • Conform to the conventions (stay consistent)
  • issue :retab! command (sublime text retab setting)

Write a simple slideshow page

Bonus points if it does not use JS.

What tools do you use to test your code's performance?

  • Profiler
  • JSPerf
  • Dromaeo
  • chrome devTool(profiles panel)

If you could master one technology this year, what would it be?

Ruby On Rails. For a good job.

Explain the importance of standards and standards bodies.

What is FOUC? How do you avoid FOUC?

FOUC meaning flash of unstyled content.

相关文章
|
机器学习/深度学习 编解码 人工智能
Reading Notes: Human-Computer Interaction System: A Survey of Talking-Head Generation
由于人工智能的快速发展,虚拟人被广泛应用于各种行业,包括个人辅助、智能客户服务和在线教育。拟人化的数字人可以快速与人接触,并在人机交互中增强用户体验。因此,我们设计了人机交互系统框架,包括语音识别、文本到语音、对话系统和虚拟人生成。接下来,我们通过虚拟人深度生成框架对Talking-Head Generation视频生成模型进行了分类。同时,我们系统地回顾了过去五年来在有声头部视频生成方面的技术进步和趋势,强调了关键工作并总结了数据集。 对于有关于Talking-Head Generation的方法,这是一篇比较好的综述,我想着整理一下里面比较重要的部分,大概了解近几年对虚拟人工作的一些发展和
|
机器学习/深度学习 数据采集 存储
Doc2EDAG: An End-to-End Document-level Framework for Chinese Financial Event Extraction论文解读
大多数现有的事件抽取(EE)方法只提取句子范围内的事件论元。然而,此类句子级事件抽取方法难以处理来自新兴应用程序(如金融、立法、卫生等)的大量文件
135 0
|
机器学习/深度学习 存储 数据采集
DCFEE: A Document-level Chinese Financial Event Extraction System based on Automatically Labeled论文解读
我们提出了一个事件抽取框架,目的是从文档级财经新闻中抽取事件和事件提及。到目前为止,基于监督学习范式的方法在公共数据集中获得了最高的性能(如ACE 2005、KBP 2015)。这些方法严重依赖于人工标注的训练数据。
181 0
Data Structures and Algorithms (English) - 6-4 Reverse Linked List(20 分)
Data Structures and Algorithms (English) - 6-4 Reverse Linked List(20 分)
129 0
Data Structures and Algorithms (English) - 7-10 Saving James Bond - Easy Version(25 分)
Data Structures and Algorithms (English) - 7-10 Saving James Bond - Easy Version(25 分)
107 0
PAT (Advanced Level) Practice - 1076 Forwards on Weibo(30 分)
PAT (Advanced Level) Practice - 1076 Forwards on Weibo(30 分)
124 0
lecture 3.2 problem set 3
"Radioactive decay" is the process by which an unstable atom loses energy and emits ionizing particles - what is commonly refered to as radiation.
1158 0
lecture 2.2 problem set 1 and 2
1 COUNTING VOWELS   (10/10 分数) Assume s is a string of lower case characters.
1052 0
AI助理

你好,我是AI助理

可以解答问题、推荐解决方案等