ByteupTech_interview Flashcards
(17 cards)
difference react local & global state?
how use it in Redux/Context?
- React: state, props, jsx,…
- Redux
- Context API
- scalability: kha nang mo rong
- prop drilling
common performance issues & how to prevent it
- re-render
- first pain
- break page/white page
- terrible UX
Fixed: react.memo, useMemo, useCallback, virtual DOM, code splitting, lazy loading
benefit of using NextJS
SEO
SSR
routing, file-based routing
getServerSideProps, getStaticProps
incremental static regeneration
describe case that SSR improve your app
first pain
time to interactive
e-commerce
SEO
performance
how to build reusable components library
from scratch?
atomic design
story book
composition
DRY
theme consistency
design system
how to handle styling in large app?
what are the pros and cons of CSS, SASS, tailwind, bootstrap,…
SCSS styling
utility class
tailwind
emotion
scalability
BEM
how to integrate 3rd party platform API and handle failure?
fetch/axios
try/catch
error boundaries
fallbacks
toast notification
swagger
the difference between REST and GraphQL? choose one and why?
endpoint based vs query based
over fetching
under fetching
graph schema + apollo client
what is your approach to testing you application?
what do you test and what tools do you use?
Jest
React testing library
unit test
snapshot test
mock API
coverage
describe you bug you fixed that required deep investigation and how to you approach it?
dev tools
console.log
network tab
breakpoint & watch each code line
redux dev tools
error boundaries
some FE techniques optimization your applied?
-lazy loading: skeletion wrapped, paging, scrolling page
-image optimization
- code splitting
- SSR
- debounce
- memoization
- bundle analyzer
How to use measure the performance of web application?
- lighthouse
- chrome dev tools
- core web vitals
- TTI
- FCP
- JS profiling
If the BE API is unstable and return inconsisten data. how could handle that in the FE?
- data validation
- fallback
- default values
- error state
- retry
- monitoring
If the designer update the UI special mid-sprint. How could you ensure smooth collaboration & delivery?
- agile
- sprint planing
- communication
-version control - component re-use
- flexibility
Your task is improve the performance of product listing page that loads thousands of items. what’s your plans
- virtual scroll
- pagination
- lazy load
- skeleton UI
- server-side pagination
[SOFT SKILLS] How to you handle disagreements with BE during API integrate?
- clear communication
- documentation
- API contract
- swagger
- team alignment
[SOFT SKILLS] Describe a time when you had to learn a new tool/tech. How do you approach it
- ask support other member
- self-learning
- documentation
- online courses
- sandbox project
- adaptability
