Frontend

How to fix the problem of redundant data fetching on the client when the data has already been loaded on the server via SSR?

How to optimize image loading in cards visible in the viewport? How to solve race condition problems when quickly switching content (e.g., YouTube Shorts)?

What was used for working with multidimensional forms — for validation, what problems were encountered, how was testing done?

You mentioned Docker, CI/CD, GitHub Actions, GitLab — can you elaborate on what exactly you did, which pipelines, what was in the containers?

How can data be cached on the server to speed up user loading?

What frameworks or tools do you work with? Do you use AI tools in your work?

#React signup form 1. Explain how StateProvider works, share your thoughts with interviewer. 2. Take a look at /src/api/mock, explain how it works. 3. Check SubmitButton color and fix it 4. Implement client form validation in Signup component. (\*) Keep in mind task number 9. Rules: - Username, Email, Password, Repeat Password fields should have at least 6 characters length; - Password should match Repeat Password; - Validation should be done upon "SignUp" button click; - Fields that have invalid values should be marked (error and helperText props); 6. API response may have an error that should be displayed to user near corresponding field. 7. Make sure that UserName component renders new username after successful submit. 8. Implement the new SignupSuccess component. It should be shown instead of sign up form. 9. Implement server validation for appropriate fields. --- Code from mock.ts: ```typescript const fakeResponse = (userName) => ({ code: 200, user: { id: 42, userName, }, }); let a = 0; const api = { '/signup': function (userName: string, email: string, password: string) { a++; return new Promise((resolve, reject) => { setTimeout(() => { if (a % 2 === 0) { return resolve(fakeResponse(userName)); } else { return reject( new Error( `Username "${userName}" is already taken. Please try another one.` ) ); } }, 500); }); }, }; export default api; ```

How does list virtualization work? How is it technically implemented through JavaScript?

Implement server-side validation for the relevant fields.

There is a player on the page. How would you implement communication between tabs so that when the stop button is pressed on one tab, playback stops on the other tab?

Implement TypeScript typings for the customMap function, which takes an array of any type and a transformer function that returns another type. The transformer function should accept three arguments (like a callback in Array.map).

Implement a function promiseWithResolver (deferred promise) that returns an object with resolve and promise fields.

How were releases delivered, how were they tested, and how often were they released?

How do you generally learn something new about programming and what is the most recent thing that you remember?

We have a very large front in the monorepo, with many different teams working simultaneously. We cannot migrate to micro-frontends. How can we minimize the risks of different teams affecting each other's work?

Create a STOP sign (a red circle with a white stripe and double border) using only one div and CSS (pseudo-elements are allowed).

What do you usually do if you feel that development is ongoing and you're slightly behind schedule? There is a release date, but you understand that you won't finish the task in time.

#React signup form 1. Explain how StateProvider works, share your thoughts with interviewer. 2. Take a look at /src/api/mock, explain how it works. 3. Check SubmitButton color and fix it 4. Implement client form validation in Signup component. (\* ) Keep in mind task number 9. Rules: - Username, Email, Password, Repeat Password fields should have at least 6 characters length; - Password should match Repeat Password; - Validation should be done upon "Sign Up" button click; - Fields that have invalid values should be marked (error and helperText props); 6. API response may have an error that should be displayed to user near corresponding field. 7. Make sure that UserName component renders new username after successful submit. 8. Implement the new SignupSuccess component. It should be shown instead of sign up form. 9. Implement server validation for appropriate fields.

How was file exchange in chat — just by POST request or were there large files?

Look at this piece of code — understand what it does, and write a simple example of its usage. There is also a similar helper in lodash.