A front-end web developer needs to know HTML/CSS, JavaScript, and many other skills. Selecting the right candidate starts with asking the right questions. Here is the list of right front end developer interview questions that need to be a part of the interview.
What Is DOCTYPE and Why Do You Need It?
The right answer is DOCTYPE is short for Document Type, and it is associated with Document Type Definition. In web development, the DTD defines how a document of a specific type should be structured. In web pages, the DOCTYPE tells the user agents what types of HTML specification your document respects.
When the user agent reads the correct DOCTYPE, it triggers a no-quirks mode (full standard) for reading the document. If the user agent cannot read the DOCTYPE correctly, it triggers a quirks mode. The DOCTYPE is mentioned at the beginning of the HTML document. It is declared as – <! DOCTYPE html>
Describe the Difference Between localStorage, sessionStorage, and a Cookie?
Cookie, sessionStorage, and localStorage are key-storage mechanisms used on the client side. All three are initiated by the Client server. The expiry of Cookie is manually set while a sessionStorage expires when the tab is closed. The localStorage never expires, and hence it is persistent across browser sessions.
Only Cookies is sent to the server with the HTTP request. The capacity of Cookie (per domain) is 4kb while that of sessionStorage and localStorage is 5 MB. Cookie and localStorage can be accessed from any window while sessionStorage can be accessed from the same tab.
What Things Should You Pay Attention to When Designing Multilingual Sites?
This is one of the important front end developer interview questions. The candidate’s answer should include the following things.
· lang attribute should be mentioned in HTML.
· Users should be directed to the native language. Changing the country and language should be easy.
· Avoid using text in images as it creates scalability problems. For example, you will need separate images with text for every language for replacements, and it can get out of control.
· You should be wary about the sentence length. Not all languages will have the same number of words for each sentence. This can lead to layout and overflow issues in design.
· Colors are perceived differently in cultures. Hence, you need to use color appropriately while designing a multi-lingual site.
· Language reading direction is different in countries and cultures. For example, for the English language, the reader starts reading from left to right and then top to bottom. For the Japanese language, the reader starts reading from up to down and then right to left.
What Is Difference Between <script>, <script defer>, and <script async>?
The right answer is
· When the browser comes across <script> tag, it immediately blocks HTML parsing, fetches and executes the script. After the script is executed, HTML parsing resumes.
· When the browser comes across<script async>tag, it fetches and executes the script without blocking HTML parsing. In simple words, both processes run parallel.
· When the browser comes across <script defer> tag, it fetches the script but does not execute it until HTML parsing is completed.
Explain Progressive Rendering?
The right answer is that Progressive rendering refers to the techniques used to improve the webpage. The candidate should be able to explain different techniques by providing suitable examples like ones mentioned below.
· Lazy loading of all images – All images are not loaded at ones. JavaScript is used to load images only when the user scrolls the page to look at the content in the lower sections of the page.
· Prioritize visual content – Only minimum CSS/scripts/content necessary to render the part that will be displayed by the browser first is loaded as quickly as possible. The deferred scripts can be used to load in other content and resources.
· Aysnc HTML fragments – Flushing the head early to reduce the time required to render the initial page. After flushing the head, other parts of pages are flushed as the page is constructed by the browser at the back-end. These are some of the right front end developer interview questions that you should ask every candidate.
