2021 Thousand Words DACHang Face Book & Personal growth experience sharing

background

My background is poor, late to the line. After three years at one company, I left at the end of 2020 because I realized how lame I was and wanted to focus on spending some time improving myself. After a billion minutes of adjustment, I reassembled. Due to the limited time before the festival, only cast a few, of course, are looking for someone to push.

$\color{#fe8c00}{阿里四轮技术 + 一轮hr}$

One side (60 min)

• To introduce myself

  It mainly focuses on several points: personal information, recent responsibilities of the company and businesses involved, main technology stack, technologies I am good at, project introduction (STAR: project background, task, your work content, project highlights, what you have achieved and learned as a result), what you have been doing recently, conclusion.

• There are two technology stacks in the CV, so talk about the differences and connections between VUE and React

  It mainly focuses on several points: template rendering of vue2, virtual DOM of VUE3, DIFF differences (VUe2, VUe3, React 16), react Fiber, reactive principle of VUE2 and reactive principle of VUe3. Vue the difference between Proxy and Object.defineProperty; Batch update of both, routing differences, common optimization methods, how to carry out data communication, talk about some fresh content: what features of the newly released VUE3, the final summary, talk about the current ecology of both……

• Project performance optimization

  Mainly around the following points: the performance optimization of the project stack, such as using React to avoid repeated rendering means, such as how electron can be closer to the native; Optimized for browser (you need to understand the principles of browser, such as cache/storage, proxy, SSR, etc., optimized for the work content of rendering engine, such as parsing CSS parsing will affect DOM rendering, synthesis optimization to reduce backflow redraw, Web worker, Event Loop, etc.); Optimizations provided by packaging tools, specifically Webpack; Optimize for specific pages, such as what should be done on the home page, the latest indicators on the home page; Finally, I will talk about the application scenarios, the methods used in my project, and the performance selection for medium projects and large projects.

  PS: If I talk about performance optimization seriously, I will not get off for two or three hours, because there is no end to performance optimization, and I only think about these in the interview…

• Do you know our products?

  I googled the team’s business project in advance and read some articles about similar products before. Based on my own project experience, I said a few words of understanding.

• What do you want to ask?

  I asked about the performance, learned about the work content of some team projects, the background of the project recruitment, and what to do to prepare for the follow-up interview.

  One side did not encounter handwritten questions, are very basic questions, the overall relatively easy.

Second interview (60 min)

At 9:30 in the evening, the interviewer should have just finished the interview and come up to ask the business directly. The whole business……

Details of the permissions page:

• How to design permissions for each module and button;
• How to design different roles and regions?
• Add a header and control the order in which it is displayed so that it is consistent across browsers. Name all the options, think of any free play…
• Is the size of localStorage the same in all browsers and mobile browsers?

Other:

• This paragraph is for my resume, skip over…
• Continue to talk about Ali’s products, after simple use, please put forward several areas that can be optimized?
• Without revealing anything, let you predict the next direction of the product, if you are, which direction you would like to go, and why you should do it, tell me what you are good at…
• Formally discuss the product, what everyone is doing, how the team works, announce the direction of the next iteration, target audience, goals…
• The usual small talk. Bye.

Episode:

There were two sudden suspensions. At that time, I felt like a roller coaster, sliding from a high altitude to a low valley, and my heart was full of — some lovely and beautiful CCTV reporter.

Three sides (60 min)

This side is the written test, haha, I reviewed a lot of handwritten questions, the result is completely diverged from the three questions, there is no intersection, EMMM…… Fortunately, it is not difficult…

Question 1:

/** * 1. Calculate the intersection of multiple intervals * the interval is represented by an array of numbers of length 2, e.g. [2, 5] represents the interval 2 to 5 (including 2 and 5); * The interval does not limit the direction, for example, [5, 2] is equivalent to [2, 5]; Intersection([5, 2], [4, 9], [3, 6]);} getIntersection([5, 2], [3, 6]); // [4, 5] * getIntersection([1, 7], [8, 9]); // null */Copy the code

Topic 2:

/** * 2. If you want to count the total number of element nodes, the maximum nesting depth of element nodes, and the maximum number of child elements in the current page when the user closes the page, you need to calculate the total number of element nodes, the maximum nesting depth of element nodes, and the maximum number of child elements. Use JS in conjunction with native DOM apis (regardless of older browsers and compatibility with modern browsers, you can use the latest features of any browser; Forget shadow DOM). For example, after running in the following page: * / < HTML > < head > < / head > < body > < div > < span > f < / span > < span > o < / span > < span > o < / span > < / div > < / body > < / HTML > will output:  { totalElementsCount: 7, maxDOMTreeDepth: 4, maxChildrenCount: 3 }Copy the code

Question 3:

/* const fn1 = (const fn1 = (... args)=>console.log('I want sleep1', ... args) const fn2 = (... args)=>console.log('I want sleep2', ... args) const event = new Events(); event.on('sleep', fn1, 1, 2, 3); event.on('sleep', fn2, 1, 2, 3); event.fire('sleep', 4, 5, 6); // I want sleep1 1 2 3 4 5 6 // I want sleep2 1 2 3 4 5 6 event.off('sleep', fn1); event.once('sleep', ()=>console.log('I want sleep)); event.fire('sleep'); * /Copy the code

Four operations (35 min)

Weekend, people sleepwalking, just off the aircraft carrier, Lingling received a phone call, people or paste……

• Cross-end principle? Taro, Uni-app, and the architecture of Flutter, React Native, and applets are mentioned in detail.
• In what scenarios can dynamic forms be used? I gave seven or eight examples.
• Mobile adaptation related issues, application scenarios.
• The business discussion of our company, whether we know about competitive products and so on, will be skipped here.

Hr five sides (60 min)

• Do you know the competing products of your project? The way
• What are the advantages and advantages of your project compared with competing products?
• What do you do after work? It’s all about your past experience. It’s too detailed for comfort.
• If you have a disagreement with your colleague, how will you resolve it
• Now for our business, there is an urgent need to add a new module location. How will you design it? How to display the data…

Yes, HR also asks technology-related questions.

$\color{#fe8c00}{#fe8c00}$

One side (60min)

• To introduce myself
• React vs. Vue stacks
• What is the most complex data structure encountered on the B side
• Quickly implement [1, 2…100], all the solutions you can think of
• Data presentation optimization, data interception and processing
• In actual scenarios, where are heap, linked list and multi-fork tree structures applied
• Es6 and ES6 + capability sets, the ones you use most, the ones that are most useful, and what problems they solve.
• GC related issues: ES6 +, the part of eventloop that involves GC.
• Array flat expansion of various solutions, array map application
• Give the general idea of V8 Sort
• Promise concurrency limits
• Written Promise. All
• Provinces and cities splicing search field, required O(N) solution
• Taiwan’s understanding
• We talked about business
• Personal Development Direction

One side of the problem step by step, the front for the rear foreshadowing.

Second face (60min)

• Project review optimization
• Let’s talk about the most complicated part of the business
• Node traffic limiting algorithm
• The most effective performance optimization method
• You mentioned performance metrics, can you tell us how they are calculated? LCP, FID
• Algorithm problem: array full array
• Taiwan business discussion
• Leaving reason

Big morning interview, the state is not good, the whole arrangement is the foundation, the mind has the idea to solve the problem, but dead or alive did not write right, after the face mercilessly handwritten several times.

$\color{#fe8c00}{color{#fe8c00}$

Technical side (60min)

• What are the types of input types? Remember the other attrs
• What are the pseudo classes and pseudo elements of CSS? What’s the difference?
• How do I create an equilateral square within a parent element of unknown width
• What blocks when loading JS asynchronously
• What are all the methods of an array? Parameter description of findIndex
• Similarities and Differences between Vue and React
• How to optimize the VUE framework
• Vue and React used by JSX
• Does id key really make list alignment more efficient? What’s a counter example?
• Webpack optimization means
• How to configure tree-shaking and how to avoid tree-shaking?
• What pit does electron and small program encounter?
• Let’s talk about wechat automated testing
• Es2015 to ES2020 new features, what you use most, give you the most benefit.
• WeakMap and Map difference, weakMap principle, why can be GC?
• How to interfere with GC?
• Webpack Import dynamic loading principle
• Know devTool in Webpack?
• How to locate errors, report data, and handle online exceptions
• Why is Webpack Caching sometimes configured, chunk or updated?
• Talk about browser and Node eventloop
• What else comes after micromissions? How is requestAnimationFrame called? Is there always a task in the requestAnimationFrame frame? Let’s talk about each case.
• How do I count frames?
• Do you know anything about Internet security?
• How can I avoid data interception by IFrame
• Talk about the status code
• Say 304. What happens to 304? Negotiate the header field of the cache?
• The way you learn
• View of engineering practice

The first question did not enter the state, I thought how to ask such a simple question, I was down for a while…… The rest of the interview went smoothly, with the interviewer being cold and non-chatty.

Boring, I asked later, is the front-end architect of Cheetah, well, big guy should have big guy’s aura, the interview experience is awesome ~~

Second Business Interview (60 minutes)

General content: business communication, engineering practice communication, what cheetah front-end is doing, what resources are available, their business is c-terminal, future direction, development, etc… This side is very easy, think what say what, of course logical must have.

Three Aspects of business (70min)

The interviewer on this side is the head of technology at Cheetah Mobile.

• How did the project collect questions and how many users?
• How to troubleshoot performance problems? Please send me the indicators of your project, specific data and screenshots…
• How is modularization implemented?
• Directory structure
• Are some functions self-developed or third-party tools used? What is the name and how to use it?
• How do unit tests and component tests work? What is the code coverage? How do you weigh testing principles?
• Project highlights/difficulties, how to solve?
• What would you do if you were asked to redesign the system?
• Engineering practice and a point of depth
• What is good about the team atmosphere? What is bad?
• What function is integrated in Taiwan? What did you do?
• How do you make technological breakthroughs and how do you learn?
• Planning for the future
• Do you have any questions? I asked a few random questions, then threw out the most important one, brazenly let the big man pointed out my question (PS: this is one of the purposes of my interview, the progress of several interviews was the fastest cheetah. What do I look like to others on the front end? I’ve always wondered. Not everyone has a clear understanding of themselves, since they can’t figure it out, that through the interview).

The points exposed in this interview: the summary of the project, overall control and self-review are all lacking. In addition, do not dig pits for yourself, sometimes know some concepts but do not know the specific practical operation and principle, or do not say. At that time, the examiner always pretended not to understand the questions about the test and always asked: Really? I’ve never done that before. Can you tell me about it? I was wrong about it, emmmm…

Hr four sides (30min)

Regular questions, not as strict as Ari’s.

• Talk about your former company
• Leaving reason
• Opinions on overtime
• The welfare of the cheetah
• Do you have any other offers?
• Balabala…

$\color{#fe8c00}{bytedance$

Technical side (60min)

• Asked me about my project at the very beginning, in great detail.
• Webpack’s way to speed up builds
• What does loader input?
• Webpack principle
• Webpack dynamic loading principle
• Webpack hot update
• How to write a WebPack Plugin
• The application of the AST
• How to parse an HTML text or take an AST
• How to write the Babel plugin
• How to design a sandbox?
• Small program API to do what processing, can achieve global variables hidden, if you, how to design?
• The basic problem test closure, I said the right idea, the result did not do right.
• Implement color conversion ‘RGB (255, 255, 255)’ -> ‘#FFFFFF’ various ideas.
• Give a number n, generate a set of integers from 0 to n-1, shuffle the order to form an array, shuffle it several times, how it looks balanced, name all the ways you can think of.
• leetcode 239
• In any question session, I asked the closure question, and I didn’t get it right.

I prepared a lot of things on this side, but the result was perfect miss.

Second side Technology Leader (60min)

• Business, business, business, there is no better solution to the project review.
• How to handle a critical incident bug
• Monitoring system
• What’s so good about the virtual DOM? Why did the framework design the virtual DOM?
• Disadvantages of WebPack, let you design a new build packaging tool, how would you design?
• Online document editing, how to deal with conflict between two people, how to display, consider various scenarios
• Excel document conflict advanced processing, article conflict? It’s a continuation of the last question.
• Write the answers directly to the basic questions:

let x = [1.2.3]; 
let y = x; 
let z = [4.5.6]; 
y[0] = 10; 
y = z; 
z[1] = 20; 
x[2] = z = 30; 
console.log(x, y, z);
Copy the code

• Basic problem: simple implementation of an LRU
• Free question session

Three-side Business Leader (60min)

• Algorithm:Find two numbers from array [1, 5, 8, 10, 12] that sum to 9, return [1, 8].
• Algorithm:Find three numbers from array [1, 5, 8, 10, 12] that sum to 19, return [1, 8, 10].
• Algorithm problemleetcode 300:Given an unordered array of integers, find the length of the longest ascending subsequence.
• Questions about my project, about 40 minutes, confused.
• No random questions. I kind of got a hunch.

Yes, my byte plane stops there, this algorithm doesn’t bother me, I can basically figure it out when I see the problem. The reason is that the project on my resume is too simple, so I did not summarize and review it properly. (One of the reasons is that MY resume is not ready for this interview, everyone, I am your precedent!) ……

Personal Experience sharing

This should be a reserved program for all aspects of the book, I also leave notes here. It is mainly divided into two aspects, one is the study of front-end technology, the other is the points that need to pay attention to in the interview.

Preparation stage

Originally wanted to introduce the resume how to write, but this aspect of the information is too much, if your resume does not pass, please find some face or push group to give assistance, let others guide, and then, say the key:

First of all, I would like to thank a student, @Shensanyuan, whom I mentioned repeatedly in the previous article. Thank you for sharing your feelings when learning and for organizing the series of articles. It is no exaggeration to say that I have studied all the articles published by Sanyuan for at least ten times, or even more, and found many clerical errors in the process of learning.

It is to say that people are forgetful, so if you forget some content, please continue to learn repeatedly, the front process is painful, the review behind is very simple, we can simply recall the lost, after all, we have so many years of education to this must have a deep experience.

At this point, you should have a little foundation, the basic common handwriting problems (see here) is not difficult to you, based on this, I spent some time to brush Leetcode, or the same routine, will not brush more, those strange skills are hard to rely on a flash of inspiration. In addition, I have compiled tens of thousands of extra words of notes (no link here…). , the contents of handwriting include but are not limited to:

• Look at the source code, sort out all the horizontal comparison between Vue and React framework, including rendering principle, virtual DOM, DIff, Patch, Fiber, batch update, handwriting response, framework used mode, design ideas, performance optimization, related ecological technologies, etc.

• Webpack principle, hot update principle, dynamic loading principle, common plugins, loader, common optimization, how to package, how to divide chunk, how to write a plugins, life cycle, microkernel source code and other content, as well as the use of rollup, gulp, application scenarios. (I remember one of the examiners said to me, “You are very clear about the whole research and development process, but they are not in-depth. For example, how to judge the basis of a Webpack package and subcontract? Emmmm, I can. You don’t ask me!

• Cross-end framework research, engineering comb, the pit of the technology stack used, some practice of the mobile terminal, additional preparation of the project recopy during the interview, competitive product survey, the data of the other party’s products, test series, and a lot of such as micro front-end, medium, serverless, visualization, Wasm, etc., are not examples.

• In addition, I also read a lot of interviews and technical articles.

Master the above content, we should be a little breadth of knowledge can calmly deal with the front of the technical side, of course, this is not just a few months can be achieved, to the accumulation of time, those who are senior cattle in a year is in the university or even earlier began to accumulate, this pass can not escape.

At this point, “technical side” this tiger should be able to play half dead, direct stem is impossible, the above knowledge for school recruitment may be enough, but the social recruitment may not be used, ha ha.

Then is the focus of the recruitment: business, how to say, is to think more and sum up, in-depth thinking, for each problem must have in-depth thinking, otherwise it is difficult to enter a big company, depth to have a high in order to get good results in the interview. It is difficult to pick out the highlights of your project, the highlights that are recognized by others, and you can only hope for more. This is also my weakness, and I was also picky at that time. This is the biggest obstacle in my job search.

Of course, I can also provide some directions for you:

• Business thinking and preparation, you can go here to see, see a little, more divergent, will certainly inspire
• Here are the business leaders I follow:Shen Jian _ The Path of Architect,冴 featherThe architect who loves to laugh
• Books: “Pyramid principle”, have time can take a look, not guarantee useful.

The interview process

A lot of books tell you to think before you answer a question, in order to organize the language, but sometimes, when you know better, you will skip key information in a nervous situation, leaving people confused. To achieve: “think clearly, say clearly, know what to say, how to say”, or a little difficult, related to the usual bit by bit accumulation, this aspect I have provided a little direction.

All that’s left is to do your job well during the interview. There’s no good way to do it. Here’s my advice:

• Think before you answer the question. It’s not guaranteed to work, but it should be done.
• Multiple times, refer to different companies, as long as you are not tired.
• When you are interviewing for a company, try to guess the general scope of the business that will be asked by the interviewer based on the previous interview, or ask the interviewer to prepare in advance. General questions will be asked: 1 the project on your resume, 2 the well-known products of the other department, 3 the title on jd recruitment.
• Make sure you don’t end up with the same questions.
• Increase the breadth of knowledge, can lead to other questions, examiners are also willing to listen to.
• Pick a good time for an interview, like me, 10 in the morning, my brain is so bright, I speak with poise and magnetism… After 7 o ‘clock in the evening, will inexplicable tension, voice decibels raise a few points slightly hoarse, this really varies from person to person. Sometimes being calm is not always a good thing. Being nervous gives you the chance to come up with a witty remark or idea, which can also be messed up.
• Find a few ways to quickly refocus your energy, which you can use in the early days of basic study.
• If you’re good enough, hint and direct the interviewer to ask about what you’re good at, and don’t be led by the nose.
• Finally, pray and burn incense for good luck. The difference between man and man lies in the difference between cognition and thinking. If you do not have a qualitative change in thinking, it is better to ask for good luck. Without a good luck, the above suggestions may not work, after all, social recruitment interview content itself is unstable, some focus on technology, some focus on algorithms, some focus on business, some focus on education, some focus on eye edge…

How to keep learning?

This is a patch, so I’ll just give you some advice:

• If you play games, give them up or quit for a while until you find a good job.
• Find your pain points.
• Study in segments and make a plan that fits the cycle. Don’t push yourself or the pressure will break you.
• Get some chicken soup, or find something you don’t have but crave.
• In business, read more books and summarize and accumulate some ways of thinking.

Finally the soul asks:

• Is it your dream to enter a big factory? It’s a small price to pay, you know.
• Are you a wonder in a million? If not, it’s normal to fail a few times. We’re all human. Maybe we just don’t match.

The last

This is the end of the article, my level is limited, I do not know how many children can save this book, I believe that many people like me will have a dream into the factory. Spring recruitment is coming, I hope everyone can get their own satisfactory offer in the spring recruitment.

Color {#ff0000}{thumbs-up}

———————————————— here is the dividing line ————————————————

After the article was published, I went back to my hometown and invested in several companies on bullet train. Here are the results.

• February 3: Got the offer from Xiaohongshu.
• Feb.4: passed bilibili and Ximalaya at the same time, and finished the oral offer.
• February 5: Bytedance fails again in its second challenge, and meituan ends up waiting for a salary.

At this point, this article finally draws to an end.