30 Questions
What percentage of the end user response time is spent on the front-end?
80-90%
What does an 'empty cache' mean in the context of web pages?
Bypassing the disk cache and requesting all the components to load the page
What does a 'full cache' allow in terms of components and HTTP requests?
Avoiding HTTP requests as most components are found in the disk cache
What is the purpose of the 'Expires' and 'Last-Modified' headers in the context of web caching?
Expires ensures the page is not cached, Last-Modified ensures the server will have to check if blank
What does the 80/20 performance rule suggest about optimization?
Focus on the 20% that affects 80% of the user experience
What is the main advantage of optimizing the front-end for performance improvement?
Simplicity in optimization
What action does 'empty cache' require in the browser?
Clearing the cache to bypass disk storage
How does a 'full cache' affect HTTP requests?
Decreases HTTP requests by avoiding disk cache
What is the significance of the 'Expires' header in web caching?
Specifies an earlier date than today for page caching
What does the 'Last-Modified' header ensure in web caching?
Forces the server to check if a page is blank
Which method is the most effective way to optimize a website?
Gzip compression
What does the Expires header control?
Caching behavior
What is the primary purpose of Content Distribution Networks (CDNs)?
Improving download speed and efficiency
What is the main benefit of using external JavaScript and CSS files?
Caching and reducing repetitive downloads
According to Yahoo's best practices, what HTTP method should be used for AJAX requests?
GET
What is the primary purpose of ReactJS?
Building user interfaces in single page applications
Which major companies use ReactJS for building user interfaces?
Netflix, Facebook, and Airbnb
What problem was React developed to address?
Complexity and performance issues of existing heavy-weight frameworks
What type of library is React?
View layer library
What is crucial for optimizing performance according to the text?
Minifying JavaScript and avoiding redirects
What is the main difference between React and Angular in terms of data binding?
React uses 1-way data binding, while Angular supports 2-way data binding
What is the purpose of JSX in React?
To allow easy mixing of HTML and JS
What are the building blocks of React applications?
Components
What is the difference between functional/stateless and class/stateful components in React?
The latter maintains its own state and lifecycle
How is state accessed and updated in React components?
Accessed via this.state and updated using setState()
What is React Native mainly used for?
Building native, cross-platform mobile apps using JavaScript and React
How does React Native differ from React?
React is for building dynamic web interfaces, while React Native is for native mobile apps
What type of data flow does React follow?
Unidirectional data flow
What is a key difference between React and Angular in terms of flexibility?
React offers more flexibility in choosing additional libraries or tools
What is a key difference between React and Angular in terms of development language?
React is built on JavaScript, while Angular is built on TypeScript
Study Notes
React and React Native Overview
- React uses 1-way data binding, unlike Angular, and employs a Virtual DOM for efficient updates.
- JSX allows easy mixing of HTML and JS, and React has a strong developer community and useful dev tools.
- Components are the building blocks of React applications, allowing for the UI to be split into reusable pieces.
- React has functional/stateless and class/stateful components, with the latter maintaining its own state and lifecycle.
- State in React is a JavaScript object containing component data, accessed via this.state and updated using setState().
- React Native is a framework for building native, cross-platform mobile apps using JavaScript and React.
- React Native implements a strict subset of CSS and is used by startups for its cost-effective development.
- React and React Native differ in that React is for building dynamic web interfaces, while React Native is for native mobile apps.
- React follows a unidirectional data flow and offers more flexibility in choosing additional libraries or tools.
- Angular, on the other hand, is a full-fledged MVC framework developed by Google, built on TypeScript.
- Angular supports two-way data binding, uses RxJS for asynchronous tasks, and has a steeper learning curve compared to React.
- Both React and Angular are popular for building SPAs, focus on high performance, but differ in flexibility and tooling.
Test your knowledge of React and React Native with this overview quiz. Explore the differences between React and Angular, understand components and state management in React, and grasp the key concepts of React Native for cross-platform mobile app development.
Make Your Own Quizzes and Flashcards
Convert your notes into interactive study material.
Get started for free