CV

I graduated from a double non-bachelor’s degree in 19 years without the support of a large factory background. I wrote my resume carefully with the experience of developing a front-end monitoring system in the past year. Now the monitoring SDK is open source: Mitojs (some company developers are using this SDK to build their own monitoring platform). In order to better open source, the old SDK will be moved to the new MitoJS and the new MITO organization. In the future, open source front-end and back-end projects, docker private deployment and free saas services will be provided in MITO organization

If there is an intention to build a small partner can talk about me ~

Bytedance – Web Infra

One video side

  1. Tell me the main features of your MITO
  2. How is the user behavior stack retrieved and updated in your SDK
  3. How does the buried point SDK implement a new page and carry the information of the original page (at least two ways)
  4. Describe the functions and implementation principles of react Fiber
  5. What’s the point of React Hook? What problem was solved?
  6. What does the vue. use function do in the source code, mainly for what?
  7. Handwritten code: Implements a function that listens for all non-enumerable browser events and reports the event name
  8. How do webpack plugins get hook entries?
  9. Handwritten code: Implement a timer with React Hook
  10. Hand-written code: Implement pipe functions similar to the WebPack Plugin (the specific topic is forgotten)

The journey time: 50 minutes

Second video interview (second interview of web Infra Leader)

  1. Tell me about yourself and the common front-end. What are your highlights?
  2. I see you open source (MitoJS), your code style is borrowed from Sentry, what is your starting point? Why not just use Sentry for private deployment instead of developing your own front-end monitoring?
  3. Tell me briefly about the architecture of your SDK and how it compares to Sentry’s SDK. (Behavior stack is more precise, hooks are better)
  4. A brief description of your performance monitoring SDK (developed by colleagues, borrowed from the official Google API)
  5. Why redevelop Google’s open source performance monitoring SDK?
  6. How does the SDK collect the user behavior stack (breadcrumbs)?
  7. How do you record a page and play it back (using the open source package RRWeb and developing it again to explain how it records and plays back)
  8. How do you check the CPU performance of the current user’s computer without using the browser’s official API? (Recording can only be started when a certain performance indicator is reached, because the recording process requires continuous serial dom nodes, so it consumes CPU)
  9. How do you deal with the high amount of concurrent data reported on web pages using Node? (redis + rocketMq)
  10. Have you pressure-tested your server yet? What is the highest QPS?
  11. Does the server do error event aggregation? What is the method of aggregation?
  12. Are sampling controls in place for collection errors?
  13. If you could design performance metrics for a single page application, what would you do? (It can be understood as how to get the time difference between route switching and route indirect interface return)
  14. What factors can cause changes in FCP, FMP, and so on?
  15. Have you learned about Long Task and are you monitoring this metric?
  16. Handwritten code: Print the Fibonacci numbers: 1, 1, 2, 3, 5, 8….
  17. Write code: implement deep copy function
  18. Handwritten code: Write a singleton pattern
  19. Handwritten code: Write a throttling function
  20. If you leave, when can you soonstart your job?
  21. What are your greatest accomplishments? We can talk about that a little bit more.
  22. Post the address of your own output article

The second side passed on the spot, about three sides ~

The journey time :1 hour and 5 minutes

Three video sides (Web Infra Leader three sides (can’t remember all))

  1. Tell me briefly about your monitoring system
  2. Why not just use Sentry for private deployment instead of developing your own front-end monitoring?
  3. Draw the whole architecture with flying, and ask why it was designed this way.
  4. How to optimize the FCP performance indicator?
  5. Did you meet any difficulties in the process of doing it, and then how to solve them?
  6. How do you check the CPU performance of the current user’s computer? (Recording can only be started when a certain performance indicator is reached, because the recording process requires continuous serial dom nodes, so it consumes CPU)
  7. Hand-written code: Implement the transform function to transform an object into a tree-like array
transform({
  0: {
    username: '0'.department: 'A-B-C',},1: {
    username: '1'.department: 'A-B-D',},2: {
    username: '2'.department: 'A-X-Y',}})// Print the result:[{name: 'A'.path: 'A'.children: [{name: '0'.path: 'A-B'.children: [{name: '0'.path: 'A-B-C'.children: []}, {name: '1'.path: 'A-B-D'.children: []},],}, {name: '2'.path: 'A-X'.children: [{ name: '2'.path: 'A-X-Y'.children: []}]},],}]Copy the code

The whole journey takes 1 hour

All around – hr

  1. Why did you leave?
  2. What kind of team and work are you looking for?
  3. Expected salary?
  4. Expected working place: Shanghai or Hangzhou?

A week later, HR in Shanghai called and said: At present, you are not qualified for the position of senior front-end engineer of Web Infra in Shanghai (the specific reason is not clear). Considering the good evaluation of you by the previous three interviewers, I transferred you to the position of Byte-R&D system in Hangzhou. I asked if I needed additional interview in the past, and I arranged additional interview that afternoon.

Fifth Side – Transfer to Hangzhou plus Side (R&D system)

  1. Handwritten topic:
/* Please implement the lottery function rand, ensure that the random input is represented by an array of objects, the object has attributes N represents the name of the person, w represents the weight of a random return a winner name, probability is proportional to w */
let peoples = [
  { n: 'p1'.w: 100 },
  { n: 'p2'.w: 200 },
  { n: 'p3'.w: 100},]let rand = function (p) {}
Copy the code
  1. What is your front-end monitoring?
  2. What is the overall architecture of the server side, starting with the technology selection
  3. Go through the process of reporting your data
  4. Why not use ES directly, but SLS (log service) of Ali Cloud?
  5. Why not consume MQ directly, instead of consuming MQ to Redis and then redis?
  6. What is your QPS?
  7. What is your number of servers and server configuration, and what is the resource utilization on the server side? (The interviewer said whether or not to talk about configuration throughput is playing rogue)
  8. Does your SDK collect metrics differently than others (ensures sequential user behavior, exposes hooks for user customization of information collection and reporting structures)
  9. How is unhandledrejection triggered? Does this event have to be reported when it’s triggered?
  10. What are the differences between your front-end page and industry monitoring?
  11. If you continue to develop your monitoring, what are your future plans for it?
  12. What do you want the new job to look like?
  13. How do you normally learn new skills?
  14. Do you consider yourself a responsible person?
  15. Do you prefer to go in all directions or do you prefer to go in one direction all the time?

Passed on the spot ~

The journey time: 1 hour and 5 minutes

Receive an email

After waiting for more than a week, I received an email asking me to submit the statement. Two days after submitting the statement, HR called me and told me briefly about salary and benefits and asked me whether I would accept it. Another week later, I sent an official offer email ~

From side to offer email: 35 days

Doodle – Performance platform

There are three aspects of technical aspects. I got the oral offer, and I asked some basic questions about JS, React and VUE on the whole.

Hello ride. – Two rides

There are three aspects of the technical aspects, get the oral offer, in addition to asking some JS, Vue, react, and leetcode simple algorithm, http2, SSL protocol and so on.

Shenzhen Tencent-PCG

One video side

  1. Interviewer self introduction: Tencent PCG mainly do what
  2. Tell me the main features of your MITO
  3. Describe briefly how your user behavior is collected and how you get XHR request status
  4. React and Vue use scenarios, how to write a vue plugin, what does the vue. use function do
  5. Handwritten code: Simple promise implementation
  6. Instead of returning a new Promise object, use the current this

Second telephone interview (CAN’t remember all)

  1. Talk about the value of MITO to your business, why this system came about and why you didn’t just go private with Sentry?
  2. React Class and Hook react Class
  3. Briefly describe react controlled and uncontrolled components
  4. React high – order components
  5. Why can Charles hijack and change HTTPS requests, and how does it work?
  6. Talk a little bit about SSL protocol, okay?
  7. Is there anything you want to ask me

After four days, SMS notification is not appropriate, I feel the second face chat also ok, hang a little puzzling

Come Future Technologies – Senior Front End Engineer

A telephone face

Because there is no recording, so I do not remember the process is very clear, only remember the interviewer is a woman, the voice is quite easy to listen ~

  1. React and Vue use the above differences
  2. Vue’s bidirectional binding principle, why can’t arrays directly change the subscript update?
  3. What does this.$set do in vue
  4. What about Babel and AST? What can you do with AST?
  5. Talk about what your MITO does
  6. Why do you need to use your MITO and what value does it bring to the business
  7. Tell me how you promoted the SDK to various lines of business
  8. Why do you want to quit and what is your plan for the next three years
  9. Is there anything you want to ask me

Half an hour after I hung up the phone, the interviewer took the initiative to add me to wechat and give me the link address for the question.

Two pen questions

//============= test code ==============
const list = [
  { id: 1001.parentId: 0.name: 'AA' },
  { id: 1002.parentId: 1001.name: 'BB' },
  { id: 1003.parentId: 1001.name: 'CC' },
  { id: 1004.parentId: 1003.name: 'DD' },
  { id: 1005.parentId: 1003.name: 'EE' },
  { id: 1006.parentId: 1002.name: 'FF' },
  { id: 1007.parentId: 1002.name: 'GG' },
  { id: 1008.parentId: 1004.name: 'HH' },
  { id: 1009.parentId: 1005.name: 'II'},]// Implement the printTree function
printTree(list)

/ / output:
// AA
// BB
// FF
// GG
// CC
// DD
// HH
// EE
// II
Copy the code

  1. Implement the thousandth bit formatting function

  2. Use a class or hook to implement ant input effects without writing CSS

I wrote it in an hour and made a phone call the next day

Second phone call

  1. Briefly describe your thoughts on the three written questions
  2. Talk about your project
  3. Controlled and uncontrolled components in React
  4. React Fiber
  5. Why do you want to leave? What would you do if you went to a company and continued to do work that you feel is not technically difficult (build low code platform, etc.)

On three sides by hr

I didn’t choose to go to the scene for personal reasons, politely declined

Beijing Meituan

One video side

  1. Bidirectional binding of Vue2 and Vue3
  2. Vue2 source code when a large number of nodes update strategy
  3. How do you collect user behavior stacks
  4. Handwritten code: stack implementation with arrays
  5. Handwritten code: Write quicksort

Second interview

Due to the byte of the Web infra four, so politely declined, but the follow-up or added meituan front end leader wechat ~

Open source

Now the monitoring SDK is open source: Mitojs (some company developers are using this SDK to build their own monitoring platform). In order to better open source, the old SDK will be moved to the new MitoJS and the new MITO organization. In the future, open source front-end and back-end projects, docker private deployment and free saas services will be provided in MITO organization

If there is an intention to build a small partner can talk about me ~

conclusion

When you have good projects or experience on your resume, try to point the interviewer in the direction of your strengths. If your resume does not have a considerable project, you can also guide the interviewer to a certain piece of source code, JS foundation, algorithm in which you have a prominent performance, you can give the interviewer a good impression ~

Finally, I wish you all can receive the offer~