UI Developer / Lead / Architect Interview Question and Answers

UI Developer / Lead / Architect Interview Question and Answers 

1) SASS vs LESS  which is better ? 

SASS is better and more reliable, flexible and most of the modern JS frameworks are using SASS for more feature availability.   

2)  List 4 types of memory leaks of JS ?

—  Unnecesseary Global Variables 

—  Unused Functions ex: timers  

—  Unnecesseary DOM reference elements 

—  Improper Closures 

—  Manage Garbae collection wherever required

3) backward compatibility  for libraries how to manage ? 

Shared dependencied must be defined in peerDependencies package attribute. 

When both your project and some module you are using depend on the same libraries but different versions than you should define 

project level library dependency in “peerDependencies” section of the package.json to avoid conflicts of multiple version libraries. 

So project dependency library installed in main folder and module specific dependency library will be installed within the module folder

so it will avoid the conflicts. 

4) profiling of pages ?

For web page loading in a browser it has to wait for 

Initialization (DNS resolution, TCP connection, proxy, and SSL negotiation),

Server rendering, 

Data transfer, 

and 

page rendering in the browser

A web page is composed from many resources besides the main contents that the browser has to resolve

 and load (JavaScripts and stylesheets).

 Then it needs to build the DOM tree from the HTML and execute any needed JavaScript

Server side performance can be improved by improving the infrastructure 

such as no: of clusters/servers, CPU, memory, bandwidth, location etc.. 

Client side performance can be improved by following parameters/criteria :

HTTP optimizations -> by Network optiomaizations like DNS/TCP/SSL connections, browser preloaders , Resource Loading time, Content loading time 

HTML and JavaScript loading optimizations -> Google RAIL model

Response (user interface): Tap to paint in less than 100ms;

Animation: Layout rendering should take less than 16ms per frame;

Idle: Use idle time to compute some work in chunks of 50ms;

Load: The page should be fully loaded in less than 1000ms.

Stylesheets optimizations -> 

Minify and Compress your files

Remove unused CSS rules

Optimize the CSS critical path

Analyze Stylesheets complexity

Image caching / sprite images  

Use CDN 

use Cache control expires

Gzip the componets for reduce load 

Stylesheets at TOP / Scripts at Bottom 

Remove duplicate code/scripts 

Use ETags for browser caching 

Profiling tools like : pingdom, google pagespeedtest to implement and optimize the suggestions 

5) how to make lightweight UI  ?  

Color minimalism

Operation simplification with the minimal steps of operation

Layered interface with flat design and skeumorphism

Micro-interaction  like “pull-down refresh”,”add to shopping cart”, etc.

6) How to make Data processing  better & faster ?  

For JS Frameworks 

 — Caching Your App data with cache layers like memcached, Redis etc.. 

 — Multi clustering of Data / Application for faster proecessing  

 — All data processing queries are Optimized

 — Check All Error in the Scripts by Logging and make all error scenarios are handled 

 For Angular 

 — Use Batarang tool to debug and fix any performance issue  

 — Chrome Dev Tool Profiler to Identify Performance Bottlenecks

 — Use console.time for Debugging Issues

 — Use ng-if or ng-switch instead of ng-show

The ng-show directive toggles the CSS display property on a particular element, while the ng-if directive actually removes the element from DOM and re-creates it if needed. 

 — Avoid using ng-repeat

 — Overuse of the ng-repeat directive can drastically drive down performance. 

 — Lower the number of elements that get looped over by implementing pagination or infinite scroll. AngularJS even has a directive called ngInfiniteScroll for that purpose. 

7) what is STRICT mode in JS ? 

 “use strict”; Defines that JavaScript code should be executed in “strict mode” so it will make “bad syntax” into real errors.

Using a variable, without declaring it, is not allowed:

Using an object, without declaring it, is not allowed:

Deleting a variable (or object) is not allowed.

Deleting a function is not allowed.

Duplicating a parameter name is not allowed:

Octal numeric literals are not allowed:

Octal escape characters are not allowed:

Writing to a read-only property is not allowed:

Writing to a get-only property is not allowed:

Deleting an undeletable property is not allowed:

The string “eval” cannot be used as a variable:

The string “arguments” cannot be used as a variable:

The with statement is not allowed:

For security reasons, eval() is not allowed to create variables in the scope from which it was called:

In function calls like f(), the this value was the global object. In strict mode, it is now undefined.

Keywords reserved for future JavaScript versions can NOT be used as variable 

Leave a Reply

Your email address will not be published. Required fields are marked *

20 − 18 =