Rechitta R1 Frontend Developer Interview Experience

Panel: Aman Desai, Atiksh Mittal

Background

I saw a LinkedIn post and emailed the recruiter. She got back to me via email after a week asking to book a slot for initial screening.

FYI, I have not even used AI to proof-read the article to make sure my raw thoughts are printed.

Screening Call

September 17

This was a call directly with the HR. She explained that this is a high growth startup working on AI real estate brokerage platform. There can be gruelling hours and last minute deadlines. Also there would be a need for relocating to Dubai after an year if everything goes well. There is also mention of ESOPs and role change to "Founding Engineer".

I have explained about my working culture, the technologies I have worked with and checked if it would align correctly with the team. One thing I was very clear, which is that I'm looking for challenging work rather than medium paced continuous work.

I really like working at startups. No matter what everyone says, it offers so much of learning. Atleast, this is my experience so far since I've worked at 3 startups.

After this, HR told me they would get back if my profile is shortlisted.

[Long Pause]

Assessment Round

September 19

I received the assessment link. The task is to build a web page according to a given figma design and it needs to be crazy responsive. The design had an interesting blob like feature which interacts with voice. The sad part here is that I have to do this in Vue, Nuxt.

Deadline: September 21

I had an interview on Sep 19 and it was a F2F round, so the entire day was exhausting. I started on the assessment the next day and tried to learn Vue, Nuxt. It hit me that whatever I learn would be instantly useless if I get rejected. Also, how much can I learn in one day? And even if I can learn, how deep can I learn? So, I used AI to complete the assessment. I've made sure to get all the requirements correct, by re-reading them and testing back and forth.

It is a small assignment but a hundred things could disqualify you just by not paying attention to details. Once I was thorough, I have added animations to the pages and elements. Submitted the assignment exactly in the last minute.

Technical Round

September 29

1. Introductions and Tell me about yourself briefly. Talk about your projects and technical expertise and experience

2. Verbally explain what is the event loop. The internals of javascript
   I explained in a short note how the call stack, web APIs, microtask queue and macrotask queues are handled. Explained event loop, but I said event loop exists outside V8.

3. What is the outuput? Javscript Puzzle

   console.log('A'); // Sync
   setTimeout(() => console.log('B'), 0); // Web APIs => Macrotask queue
   Promise.resolve().then(() => console.log('C')); // MicTask Q
   queueMicroTask(() => console.log('D')); // MicTask Q
   console.log('E'); // Sync
   

   Added comments and then explained.

   1. Follow up was to write a custom queueMicroTask function which I didn't anticipate.

      const customQueueMicroTask = function (fn) {
          Promise.resolve().then(() => fn())
      }
      

      Then, I was asked to replace my own function with the inbuilt function and run the code. It did run with correct output. But, I missed adding catch block to the promise. Also, I called promise like a function because I was nervous.

4. Explain debouncing and throttling. Write the debounce function.

   Given a time window, debouncing will wait until the delay and then execute the last function calls, cancelling remaining ones.
   Given a time window, throttling will allow the function to execute only once.

   function customDebounce(fn, delay) {
     let timer;
     return function(...args) {
       clearTimeout(timer)
       timer = setTimeout(() => fn.apply(this, args), delay)
     }
   }
   

5. What is the output for given code

   async function f() {
     console.log(1);
     await null;
     console.log(2);
   }
   console.log(0);
   f();
   console.log(3);
   

   I gave the ouput as 0 3 1 2 and the interviewer asked me to run it. I got output as 0 1 2 3. I didn't fully understand how async functions are executed inside JS.

   1. As a follow up, interviewer asked me to produce same output without the async-await.

      let a = () => console.log(1);
      let f = () => Promise.resolve().then(() => {
        console.log(2)
      })
      console.log(0);
      a();
      f();
      console.log(3);
      

      This was what I could think of at that moment. Interviewer probed more by asking me to re-write without the function a but then there was a brief power cut at my end. So, they basically passed this question.

6. How is tailwindcss built in a build? How does it render CSS? All at once or only on demand?

   The interview basically went downhill from here. My answer was that all the stylesheets are loaded at once at build time. Then, the classes are picked by the elements. So, there are huge stylesheets and we're just re-using those classes.
   The follow up came immediately asking me, "How would you optimise this bundle size to pick only necessary styles?" My answer was not correct, but he nodded anyway.

7. Dugged further by asking me to explain how tailwindcss actually works

   All I could say is that, tailwindcss is like a plugin and it does the job automagically. Interviewer nodded anyway.

8. Then a few classNames were given and it was quiz

   <div class="p-2 md:p-4" />
   /*
     Q: What class would be applied for lg screens
     A: p-4. Because, md is a breakpoint and so any width/height after the breakpoint also applies same CSS.
   */
   <div class="md:p-4" />
   /*
     Q: What class would be applied for sm screens
     A: None. Because, md is a breakpoint and there is no fallback CSS.
   */
   <div class="p-2 p-4" />
   /*
     Q: Which padding is finally applied
     A: p-4. Because, p-4 preceeds p-2.
   */
   

   Overall, the interview probed me for true senior level depth, ownership and responsiveness.

   This interview exposed all the holes in my preparation. I definitely am aware that I don't have true depth. Most of the times, I cared more about outcome than the "why" behind. I'm actively trying to overcome this.

   I have not received final outcome yet. I won't be surprised if it is negative. The goal is progress not perfection.

The result is not given yet. Stay tuned for more! I will write more about interviews and my preparation journey 🚀