Đáp án Quiz React Native — 75 câu hỏi có giải thích

Đáp án: C

Cùng React, khác đích dựng hình: View và Text trở thành view native của Android và iOS thay vì phần tử DOM. Vì vậy không có HTML, không có CSS thật, và mọi API liên quan tới trình duyệt đều không tồn tại.

Đáp án: B

StyleSheet.create tạo đối tượng kiểu một lần thay vì mỗi lần render, và kiểm tra tên thuộc tính nên gõ sai bị bắt sớm. Với đối tượng viết thẳng trong JSX, mỗi lần render sinh một tham chiếu mới và làm hỏng việc so sánh props.

Đáp án: C

ScrollView dựng toàn bộ phần tử con ngay khi hiển thị, nên danh sách dài làm màn hình khựng và tốn bộ nhớ. FlatList chỉ dựng phần đang nhìn thấy cộng một vùng đệm, và tự thu hồi phần đã cuộn qua.

Đáp án: D

Mặc định là column, ngược với web vốn mặc định row. Ngoài ra flex: 1 trong React Native tương đương flex: 1 1 0 và mọi View đều là vùng flex, không cần khai báo display.

Đáp án: D

Hai cách: kiểm tra Platform.OS trong mã, hoặc tách tệp thành Component.ios.tsx và Component.android.tsx để bộ đóng gói tự chọn khi build. Ngoài ra Platform.select cho phép chọn giá trị theo nền tảng ngay trong đối tượng kiểu.

Đáp án: A

AsyncStorage là kho khoá và chuỗi không mã hoá, hợp cho thiết lập nhẹ như ngôn ngữ, chế độ tối, cờ đã xem hướng dẫn. Token phải nằm trong kho an toàn, còn dữ liệu cần truy vấn thì dùng cơ sở dữ liệu cục bộ.

Đáp án: A

Pressable là API mới thay cho họ Touchable. Nó cho style và children nhận trạng thái nhấn, hỗ trợ vùng chạm mở rộng qua hitSlop, khoảng trễ nhấn giữ và ngưỡng huỷ khi kéo ra ngoài.

Đáp án: D

Expo quản lý phần native: cấu hình được sinh từ tệp cấu hình và có dịch vụ build trên đám mây. Dự án thuần thì thư mục android và ios nằm trong kho mã và mọi thay đổi native do lập trình viên tự làm.

Đáp án: D

Metro là bộ đóng gói JavaScript của React Native: gộp mã và tài nguyên thành gói cho ứng dụng nạp, đồng thời chạy server phát triển để cập nhật nhanh khi sửa mã. Phần native vẫn do Gradle và Xcode biên dịch.

Đáp án: D

Dùng ngữ cảnh vùng an toàn để đọc phần chèn thật của thiết bị, rồi áp vào khoảng cách hoặc dùng thành phần bọc sẵn. Số cố định luôn sai trên ít nhất một dòng máy, và lỗi này chỉ lộ ra khi kiểm thử trên nhiều thiết bị.

Đáp án: C

Dùng numberOfLines trên Text, kèm ellipsizeMode để chọn cắt ở đầu, giữa hay cuối. Cắt bằng slice là sai vì số ký tự vừa một dòng phụ thuộc cỡ chữ hệ thống và bề rộng thiết bị.

Đáp án: B

useWindowDimensions là hook nên cập nhật khi kích thước đổi: xoay màn hình, chia đôi màn hình, hoặc mở máy gập. Dimensions.get chỉ chụp một lần, và giá trị đó cũ ngay lần xoay đầu tiên.

Đáp án: D

Ô nhập trở thành được điều khiển nhưng không cập nhật: người dùng gõ, React dựng lại và đưa nội dung về giá trị cũ, nên chữ như không vào được. Có value thì phải có onChangeText, hoặc dùng defaultValue cho ô không điều khiển.

Đáp án: B

Linking.openURL với địa chỉ theo lược đồ phù hợp: tel: để gọi, mailto: để soạn thư, https: để mở trình duyệt, hoặc lược đồ riêng của ứng dụng khác. Nên kiểm tra khả năng mở trước khi gọi để xử lý được trường hợp không có ứng dụng nào nhận.

Đáp án: C

Bộ đóng gói phân giải require lúc build để biết ảnh nào cần đưa vào gói và chọn đúng biến thể độ phân giải. Đường dẫn ghép động lúc chạy thì không thấy được, nên ảnh không được đóng gói và hiển thị rỗng.

Đáp án: A

Modal hiển thị trên một lớp phủ nằm trên toàn bộ giao diện nên không bị cắt bởi phần tử cha. Đổi lại nó nằm ngoài ngăn xếp điều hướng, nên nút quay lại trên Android cần được xử lý riêng qua onRequestClose.

Đáp án: A

Đặt barStyle là dark-content cho nền sáng và light-content cho nền tối, khai báo ở từng màn hình. Trên Android còn đặt được màu nền thanh trạng thái, còn iOS thì không nên chỉ đặt một lần ở gốc ứng dụng.

Đáp án: B

SectionList nhận mảng nhóm, mỗi nhóm có tiêu đề và mảng dữ liệu con, đồng thời có tuỳ chọn ghim tiêu đề khi cuộn. Nó giữ được cơ chế dựng lười giống FlatList nên phù hợp với danh bạ, lịch sử theo ngày, danh mục sản phẩm.

Đáp án: B

Đăng ký lắng nghe sự kiện nút quay lại và trả về giá trị cho biết đã xử lý, thường kèm hộp thoại xác nhận rời màn hình. Nhớ gỡ đăng ký khi màn hình mất tiêu điểm, nếu không hành vi sẽ dính sang màn hình khác.

Đáp án: B

Thư viện điều hướng giữ màn hình trong ngăn xếp khi mở màn hình mới, nên khi quay lại component không được dựng lại và hiệu ứng chạy một lần không chạy lại. Cần dùng hook chạy theo tiêu điểm màn hình.

Đáp án: C

Cầu nối cũ chuyển mọi lời gọi thành thông điệp JSON xếp hàng bất đồng bộ. JSI cho JavaScript giữ tham chiếu tới đối tượng native và gọi thẳng, nên bỏ được chi phí tuần tự hoá và cho phép lời gọi đồng bộ khi cần.

Đáp án: B

Hermes biên dịch JavaScript thành mã byte lúc build, nên khi mở ứng dụng không phải phân tích và biên dịch mã nữa. Kết quả rõ nhất là thời gian tới màn hình đầu giảm, kèm mức dùng bộ nhớ thấp hơn và dung lượng ứng dụng nhỏ hơn.

Đáp án: B

getItemLayout cho danh sách biết trước chiều cao và vị trí từng dòng, nên bỏ được bước đo động khi cuộn và cho phép nhảy tới chỉ số bất kỳ ngay lập tức. Nó chỉ dùng được khi chiều cao dòng cố định hoặc tính được.

Đáp án: B

memo so sánh props theo tham chiếu. Một hàm gọi lại hoặc một đối tượng kiểu tạo ngay trong JSX sinh tham chiếu mới ở mỗi lần render, nên phép so sánh luôn thất bại. Cần useCallback và useMemo cho các props đó.

Đáp án: D

Native stack dùng thành phần điều hướng thật của Android và iOS, nên hiệu ứng chuyển màn hình và cử chỉ vuốt về do nền tảng xử lý. Đổi lại, khả năng tuỳ biến hiệu ứng ít hơn so với bản dựng bằng JavaScript.

Đáp án: D

useNativeDriver gửi mô tả hoạt ảnh xuống tầng native để chạy độc lập với JS thread, nên hoạt ảnh không giật khi JavaScript bận. Nó chỉ áp dụng cho biến đổi hình học và độ mờ, không dùng được cho các thuộc tính bố cục như chiều rộng hay khoảng cách.

Đáp án: A

Thư viện cử chỉ chuyên dụng nhận dạng cử chỉ ở tầng native, nên phản hồi không bị trễ khi JS thread đang bận. Chúng cũng có sẵn cơ chế phối hợp giữa các cử chỉ đồng thời hoặc loại trừ nhau, thứ phải tự viết với PanResponder.

Đáp án: C

Ảnh chiếm bộ nhớ theo kích thước điểm ảnh thật sau khi giải mã, không theo kích thước hiển thị. Một ảnh bốn nghìn điểm ảnh hiển thị trong ô một trăm điểm vẫn tốn như ảnh gốc, nên phải yêu cầu server trả ảnh đúng cỡ hoặc thu nhỏ trước khi hiển thị.

Đáp án: A

Bản release rút gọn mã, tắt kiểm tra phát triển và dùng cấu hình khác. Các nguyên nhân phổ biến: mã dựa vào tên lớp hoặc tên hàm bị đổi khi rút gọn, luật giữ mã của trình rút gọn thiếu, biến môi trường trỏ sai, và tài nguyên chỉ có trong bản gỡ lỗi.

Đáp án: B

Context không có cơ chế chọn phần dữ liệu: đổi giá trị là mọi component đọc nó đều dựng lại, kể cả những component chỉ quan tâm một trường khác. Với state đổi theo từng ký tự, đó là hàng loạt render thừa.

Đáp án: B

Huỷ yêu cầu bằng tín hiệu huỷ và bỏ qua phản hồi tới muộn. Trong React, dọn dẹp trong hàm trả về của useEffect là chỗ đúng; nếu dùng thư viện dữ liệu server thì phần này đã được xử lý sẵn.

Đáp án: B

Phải khác định danh gói: applicationId trên Android và bundle identifier trên iOS. Kèm theo đó thường đổi tên hiển thị và biểu tượng để phân biệt bằng mắt, và mỗi biến thể trỏ tới một endpoint riêng.

Đáp án: B

Tìm theo thứ người dùng nhận biết được: chữ hiển thị, nhãn khả năng tiếp cận, chỗ giữ chỗ của ô nhập. Nhờ vậy kiểm thử mô tả hành vi chứ không mô tả cấu trúc, và tái cấu trúc component không làm kiểm thử vỡ.

Đáp án: C

Chỉ phần JavaScript và tài nguyên được cập nhật. Thêm thư viện native, đổi quyền hoặc nâng cấp React Native đều phải qua cửa hàng. Ngoài ra bản cập nhật phải phù hợp chính sách của cửa hàng, không được đổi bản chất tính năng của ứng dụng.

Đáp án: B

Dùng thành phần né bàn phím bọc ngoài vùng cuộn, và đặt hành vi khác nhau cho hai nền tảng vì chúng xử lý phần chèn bàn phím theo cách khác nhau. Khoảng đệm cố định luôn sai trên một dòng máy nào đó.

Đáp án: B

Dữ liệu server là bản sao của thứ thuộc về nơi khác, nên luôn có thể cũ và cần bộ đệm, làm mới, thử lại, khử trùng lặp yêu cầu. State giao diện thì thuộc sở hữu của ứng dụng và không có những nhu cầu đó.

Đáp án: A

Khi cần một API nền tảng chưa có thư viện nào bọc, hoặc phải tích hợp một bộ công cụ chỉ có bản native, ví dụ thư viện của đối tác thanh toán hay thiết bị phần cứng chuyên dụng.

Đáp án: D

Khi ứng dụng đang hiển thị, hệ điều hành giao dữ liệu cho ứng dụng thay vì tự vẽ thông báo. Muốn thấy gì đó thì tự hiển thị bằng thông báo cục bộ hoặc một banner trong ứng dụng dựa trên dữ liệu nhận được.

Đáp án: A

Cần xác minh quyền sở hữu tên miền: assetlinks.json cho Android và apple-app-site-association cho iOS, đặt đúng đường dẫn well-known trên https. Thiếu bước này thì liên kết chỉ mở trình duyệt.

Đáp án: A

Phát hành app bundle để cửa hàng sinh bản cài theo kiến trúc và mật độ màn hình từng máy, đồng thời bật rút gọn mã và loại bỏ tài nguyên không dùng. Đây là hai bước cắt được nhiều nhất mà không đụng tới tính năng.

Đáp án: B

Thiếu bản đồ nguồn khớp đúng phiên bản. Bản phát hành rút gọn mã nên tên hàm mất ý nghĩa; phải tải bản đồ nguồn lên dịch vụ giám sát ở mỗi lần phát hành, và với Android còn cần tệp ký hiệu cho phần native.

Đáp án: A

Cần accessibilityLabel mô tả hành động và accessibilityRole là nút. Nhãn nên nói việc sẽ xảy ra chứ không mô tả hình vẽ: đọc lên là lưu bài viết thì hữu ích, còn đọc lên là biểu tượng dấu sao thì không.

Đáp án: D

Dùng các thuộc tính theo hướng đọc như marginStart, paddingEnd, textAlign là left chỉ khi thật sự cần cố định. Chúng tự đảo khi ngôn ngữ viết từ phải sang trái, còn marginLeft thì không đổi và làm bố cục lệch.

Đáp án: A

Dùng kho an toàn dựa trên Keychain của iOS và Keystore của Android. Đó là nơi duy nhất có bảo vệ ở mức hệ điều hành. Access token nên ngắn hạn và giữ trong bộ nhớ, còn refresh token phải thu hồi được từ server.

Đáp án: A

Metro chỉ theo dõi thư mục dự án theo mặc định, nên mã nằm ở package khác không được phân giải. Phải khai báo thư mục theo dõi trong cấu hình Metro và xử lý trường hợp cùng một thư viện xuất hiện ở nhiều nơi trong cây phụ thuộc.

Đáp án: B

Hỏi đúng lúc người dùng chạm vào tính năng cần quyền. Lúc đó lý do hiển nhiên nên tỉ lệ đồng ý cao. Hỏi ở màn hình mở đầu là cách nhanh nhất để bị từ chối, và trên iOS thì hộp thoại chỉ hiện một lần duy nhất.

Đáp án: A

Cửa hàng phân biệt các lần tải lên bằng số build, nên trùng số là bị từ chối. Cách bền là để hệ thống tích hợp liên tục cấp số tự động thay vì sửa tay, còn tên phiên bản hiển thị thì do con người quyết định.

Đáp án: B

Rà phần khởi tạo chạy trước khi dựng giao diện: khởi tạo dịch vụ, đọc kho lưu trữ, gọi cấu hình từ xa. Chỉ giữ những gì quyết định màn hình đầu, phần còn lại chuyển sang chạy sau khi giao diện đã hiển thị.

Đáp án: D

Dùng ranh giới lỗi đặt quanh từng khu vực: một tab, một danh sách, một thẻ nội dung. Lỗi được giữ trong khu vực đó và hiển thị giao diện dự phòng, thay vì làm trắng toàn bộ ứng dụng.

Đáp án: D

React Native yếu thế với ứng dụng đồ hoạ nặng như trò chơi hoặc xử lý ảnh thời gian thực, và với ứng dụng cần tích hợp sâu vào hệ thống như tiện ích màn hình chính. Đội đã mạnh native cho một nền tảng duy nhất cũng nên cân nhắc kỹ.

Đáp án: A

Worklet là hàm JavaScript được biên dịch để chạy trên UI thread. Nhờ vậy hoạt ảnh và phản hồi cử chỉ vẫn mượt khi JS thread chính đang bận, đổi lại nó không truy cập được trực tiếp state của React.

Đáp án: B

Cơ chế tái dùng view: khi một dòng cuộn khỏi màn hình, view của nó được gán dữ liệu mới thay vì bị huỷ và tạo lại. Cách này giảm mạnh chi phí khi cuộn nhanh, nhưng cần biết trước ước lượng kích thước dòng.

Đáp án: A

Reducer nhận một bản nháp được theo dõi thay đổi. Cú pháp trông như sửa trực tiếp nhưng thư viện dựng ra một state mới bất biến từ các thay đổi đó, nên quy tắc bất biến của Redux vẫn được giữ.

Đáp án: A

Component dựng lại theo mọi thay đổi trong kho, kể cả những phần nó không dùng. Trên di động, một danh sách dài đăng ký cả kho là cách nhanh nhất để mọi thao tác nhỏ đều gây rớt khung hình.

Đáp án: D

Giá trị được giữ ngoài state React nên gõ phím không dựng lại cả biểu mẫu. Trên biểu mẫu dài chạy ở máy tầm trung, khác biệt này thấy được ngay bằng mắt qua độ trễ giữa lúc gõ và lúc chữ hiện.

Đáp án: C

Sai tên họ phông: hệ thống tra theo tên nội bộ trong tệp chứ không theo tên tệp, và khi không tìm thấy thì im lặng dùng phông mặc định mà không báo lỗi. Ngoài ra thêm phông cần build lại phần native.

Đáp án: A

Một tệp vector phục vụ mọi mật độ điểm ảnh, không cần bộ ảnh cho từng độ phân giải, và đổi màu bằng thuộc tính nên một biểu tượng dùng được cho cả chế độ sáng lẫn tối. Đổi lại, hình rất phức tạp có thể vẽ chậm hơn ảnh bitmap.

Đáp án: A

Gom nhóm điểm theo mức thu phóng và chỉ hiển thị các điểm nằm trong viewport hiện tại. Nghìn view riêng lẻ là quá tải cho tầng native, còn gom nhóm giữ số view ở mức vài chục bất kể tổng số điểm.

Đáp án: A

Thu nhỏ và nén ở phía thiết bị trước khi gửi. Ảnh gốc từ máy ảnh hiện nay thường vài megabyte, gửi nguyên bản tốn dữ liệu di động, dễ hết thời gian chờ trên mạng yếu, và server vẫn phải thu nhỏ lại.

Đáp án: A

Sinh trắc là lớp mở khoá cục bộ: nó bảo vệ quyền truy cập vào phiên đang lưu trên thiết bị, chứ không phải bằng chứng danh tính gửi lên server. Server vẫn phải xác thực bằng token và kiểm tra quyền như bình thường.

Đáp án: D

Không có quy ước thì mỗi người đặt một kiểu, và sau vài tháng bảng theo dõi đầy các sự kiện gần giống nhau mà không ghép được. Sửa sau rất tốn vì dữ liệu lịch sử đã ghi theo tên cũ và không đổi lại được.

Đáp án: C

Trên di động, bản sửa lỗi phải qua duyệt và người dùng có thể không cập nhật trong nhiều tuần. Cờ tính năng cho phép tắt ngay một tính năng hỏng trên các bản đã cài, và mở dần tính năng mới cho một phần người dùng.

Đáp án: D

Mặc định theo thiết lập hệ thống và cho phép ghi đè trong ứng dụng với ba lựa chọn: theo hệ thống, luôn sáng, luôn tối. Giá trị ghi đè lưu cục bộ vì nó gắn với thiết bị chứ không gắn với tài khoản.

Đáp án: A

Giữ ít và tập trung vào luồng sống còn: đăng nhập, thanh toán, main thread tạo ra doanh thu. Mỗi lần chạy tốn phút và dễ chập chờn, nên phủ rộng bằng kiểm thử đơn vị và kiểm thử component thì kinh tế hơn nhiều.

Đáp án: B

Phần khó là xung đột: cùng một bản ghi bị sửa trên thiết bị và trên server trong lúc mất mạng. Phải chọn giữa lấy bản mới nhất, giữ bản server, hợp nhất theo trường, hoặc hỏi người dùng, và mỗi cách đều có cái giá.

Đáp án: B

Lưu theo giờ chuẩn quốc tế và chỉ chuyển sang múi giờ thiết bị khi hiển thị. Người dùng đi lại, đổi múi giờ và đồng hồ thiết bị có thể sai, nên dữ liệu gốc phải độc lập với những thứ đó.

Đáp án: C

Đăng ký sự kiện, bộ đếm giờ và kết nối realtime không được dọn trong hàm trả về của hiệu ứng. Chúng giữ tham chiếu tới component nên toàn bộ cây con không được giải phóng, và mỗi lần mở lại màn hình là thêm một bản nữa.

Đáp án: D

Nâng trên nhánh riêng và dùng công cụ so sánh khác biệt giữa hai phiên bản để biết chính xác tệp cấu hình native nào phải sửa. Sau đó nâng thư viện theo từng nhóm nhỏ và kiểm thử lại main thread trên cả hai nền tảng.

Đáp án: D

Hoãn việc nạp module bằng cách yêu cầu chúng ngay tại chỗ dùng thay vì nạp ở đầu tệp. Module chỉ được đánh giá khi lần đầu cần tới, nên các màn hình ít mở không làm chậm khởi động.

Đáp án: B, C, D

Ba trạng thái tối thiểu: đang tải, rỗng và lỗi có nút thử lại. Bỏ trạng thái rỗng là nguyên nhân phổ biến nhất của màn hình trắng, và bỏ nhánh lỗi khiến người dùng không có cách nào tiếp tục.

Đáp án: D

Bật tuỳ chọn dựng lười cho các tab để mỗi tab chỉ được dựng khi lần đầu người dùng mở. Kèm theo đó, chỉ gọi dữ liệu khi tab có tiêu điểm thay vì gọi tất cả lúc khởi động.

Đáp án: C

Cần hai lớp: cờ đang gửi ở tầng state để chặn lời gọi thứ hai và cho nút vào trạng thái chờ, và khoá idempotent gửi kèm yêu cầu để server nhận ra lần thử lại và trả về đúng bản ghi cũ.

Đáp án: D

Chỉ tự cuộn khi người dùng đang ở gần cuối. Nếu họ đang đọc lại tin cũ thì hiện một chỉ báo có tin mới thay vì kéo màn hình, để họ tự chọn thời điểm nhảy xuống.

Đáp án: B

Nhìn vào phân bố ở nhóm phần trăm cao, ví dụ số khung hình chậm trong năm phần trăm tệ nhất. Giá trị trung bình che mất các đợt khựng, mà trải nghiệm lại được định hình bởi đúng những lần khựng đó.

Đáp án: D

Coi như công khai. Mọi chuỗi trong gói cài đặt đều trích xuất được, và rút gọn mã không thay đổi điều đó. Bí mật thật phải nằm ở server; khoá bắt buộc có ở phía ứng dụng thì phải giới hạn quyền và giả định sẽ bị lộ.