Vitali Zaidman
Software Architect and React.js Expert.
medium.com/@vzaidman
twitter.com/vzaidman
github.com/vzaidman
linkedin.com/in/vzaidman
facebook.com/vzaidman
vzaidman@gmail.com
Hey! Welcome to my website :)
I've been developing Web And Mobile applications since 2012. Currently working at Meta.
I like to lead and tutor teams as a hands-on expert. I also maintain open-source projects, give lectures, participate in podcasts, and write about web technologies.
To build my website, since I didn't want to lose the chance to try something new, I've created it on my own without any libraries: Here's my website's source code.
Also, check out how lightning-fast Google takes it to be: Google insights for the website
# Projects
Meta
Building the Metaverse.
Software Engineer
-
Working on a variety of stuff as a generalist
Welldone Software Solutions Ltd.
A web development and tutoring company.
Software Architect, React.js Expert, Technical Publisher
-
Software Architect with broad experience in hands-on coding, architecture design, helping C-suite management make good decisions, and leading teams to success. I'm also a React.js expert with open-source contributions and publications about web development.
SCRUMGitSEOJavaScriptNode.jsReact.jsAngularDockeriOSAndroidWindows PhoneManagementSalesJust Eat TakeAway.com
The biggest platform for ordering food online.
Software Architect
-
Was responsible for re-building the www.10Bis.co.il website from scratch with a team of 5 people. We did it in a very short time, even though some people from the team were unfamiliar with Next.js and React.
Later, I lead the creation of several other projects while also leading the front-end guild of around 7 people.SEOManagementAgileGitNext.jsReactReduxDockerCypress TestingStorybookJestPowToon
Cloud-based software for creating animated presentations.
Team Leader / Technical Leader
-
Initially I started off in charge of migrating PowToon's Web App from Flash to HTML5-React-Redux, essentially re-building the site from scratch. I created the infrastructure of the project and did the core graphical-mathematical work as well.
Our team of around 8 people consisted of developers from WellDone Software and PowToon. I was responsible to tutor and train PowToon's staff in learning everything about HTML5-React-Redux.
Later, I worked on the project's CI, testing, PowerPoint plug-in, and many other side projects.ManagementAgileGitGit flowAWSReactReduxDockerBitBucket Pipelines CITestCafe + Jest TestingTypeScriptCss-GridsStorybookharmon.ie
User experience tools for intelligent email and Office365/SharePoint Management.
Full-Stack Developer, Mobile Developer
-
In these very intense three year period, I had the opportunity to work on many of harmon.ie's products. We developed web apps, Microsoft Office Plug-ins, and several apps for Android, iOS, and Windows Phone using Cordova.
During that time, I gained a lot of experience with various APIs by creating a cross-platform aggregation software that combines information from SharePoint, SalesForce, social networks, management platforms, and e-mail.AgileWeb ServicesGitReactReduxSenchaCordovaAndroidiOSWindows PhoneMicrosoft Office PluginsSharePointVarious API's like Facebook, SalesForce, and Zendesk
# Education
The Open University of Israel
The Open University is open to anyone who wishes to study towards a bachelor's degree, without any prerequisites or screening process.
The Open University, However, has high academic standards and its graduates are considered very competent in their fields.B.Sc., Computer Science
-
# Meetup Videos
What developers need to know about SEO (in Hebrew)
—Developers tend to know very little about SEO because usually we tend to focus on how the website is exposed towards users and not bots, but it’s a very beneficial thing to know. SEO is very important for most of the modern websites because higher rank = more traffic = more money.
Link to recordingTakeaway.com webinar - Do You Need Server Side Rendering? What Are The Alternatives?
—There are numerous strategies to choose from when building modern HTML-based apps today.
You can render it on the client-side, the server, or even generate it during build time.
You need to make a choice, and tools like Gatsby, Next.js, Angular Universal, ScullyIO, and NuxtJS can help you get there.
How do you make the right choice though? Why would you choose one over the other?
Link to recordingLecture in Architecture Next 2020 - Do You Need Server Side Rendering? What Are The Alternatives? (in Hebrew)
—One full day, over 500 participants, 3 tracks, 13 lectures, and one cloud experts panel!
Wow, we had a blast.
The software development world is developing at a tremendous pace. New technologies and platforms are abundant, and things that were brand new a year ago sometimes suddenly seem like ancient history. The software architect’s job is to figure out how to best use these technologies and platforms to his/her advantage, and that job is getting harder and harder. At Architecture Next 2020 we discussed revolutionary concepts and tools and demonstrated how they can be applied towards making your next software system a better one.
Due to Coronavirus related restrictions, this year’s conference, held for the third consecutive year, was all virtual. But as usual, was packed with great content and insightful speakers.
Link to recordingTakeaway.com Webinar - Advanced React – Virtual DOM and Performance
—The Virtual DOM is roughly what we generate through the renders of React components. But React is designed in a way where we don’t usually need to care about what exactly happens as a result of these renders. This lecture aims to explain the relationships between different React elements- a concept that would help us reveal React patterns where performance might be an issue, and how to handle them.
Link to the lecture recordingCodeValue Webinar - Advanced React – Virtual DOM and Performance
—The virtual DOM is what we generate through the renders of React components. But React is designed in a way where we don’t care about what happens as a result of these renders. This lecture aims to explain the relationships between different React elements- a concept that would help us to reveal React patterns where performance might be an issue. We would later show how to avoid running into these performance issues.
Link to the lecture recordingImprove React Performance
—I've recently worked a lot on performance improvement. I've read a lot of articles, and written a lot of lines of code. I've even maintained one of the most important libraries to detect performance issues (why-did-you-update), and later wrote an even better library from scratch (why-did-you-render).
My lecture will focus on how React's Virtual DOM actually works, and how to work with it efficiently when performance issues arise. We will also talk about what "performance issues" actually mean, and how to detect them.
Filmed @ Negev web developers meetup at wix offices, Beer Sheba
# Podcasts
JSJ 490: Mastering Browser Caching with Vitali Zaidman
—The Jabber panel along with Vitali Zaidman jump in and discuss how your browser cache works, what the standard is, and what you can expect when you're trying to take advantage of the performance characteristics of your users' browsers.
RRU 087: The why-did-you-render Library and React Performance with Vitali Zaidman
—In this episode, the panel discusses React Performance. The panel talks about performance in general tools, concepts and priorities.
JSJ 402: SEO for Developers with Vitali Zaidman
—Today's show is about SEO for developers. SEO stands for search engine optimization, which helps your website appear higher on search engines.
My JavaScript Story - Vitali Zaidman
—In this episode of My JavaScript Story, Charles hosts Vitali Zaidman, Technical Lead at WellDone Software Solutions
JavaScript Jabber - ”An Overview of JavaScript Testing in 2018” with Vitali Zaidman
—In this episode, the panel talks with programmer, Vitali Zaidman, who is working with Software Solutions Company. He researches technologies and starts new projects all the time, and looks at these new technologies within the market. The panel talks about testing JavaScript in 2018 and Jest.
# Open Source
vzaidman.com
—This site is built with an open source project that is written with vanilla js.
It allows developers to compile a full HTML website of a tiny sizeReact-Redux
—A small but important performance fix in the early stage of react-redux migration to React hooks
Why Did You Render
—why-did-you-render monkey patches React to notify you about avoidable re-renders.
(Works with React Native as well.)memoize-last-for-key
—Creates a function that caches the last result of arguments, by key calculated from the arguments.
xml-fix-loader
—A webpack loader canonizing xml files, fixing issues like unquoted attributes:
<div width=100px /> → <div width="100px"/>FileListPlugin
—A webpack plugin to list all deployed files.
# Publications
Debugging React performance issues with Why Did You Render
—This demonstration shows how to detect and resolve performance issues in React using the library Why Did You Render.
Jest — How To Mock a Function Call Inside a Module
—Mocking function calls within a module
useCallback Might Be What You Meant By useRef & useEffect
—Sometimes we respond to React element mounts. The first instinct is to useRef & useEffect. But It’s wrong. What you really need is often useCallback.
React — When Should Pure Components Be Used?
—React.memo / React.PureComponent usage guide
React- useCallback Invalidates Too Often in Practice
—What is issue #14099 in React’s repo and how it affects you?
Forced to Work From Home? Maybe It’s a Blessing in Disguise?
—When working remotely, you benefit much more from good working processes and proactive team members and you are punished much more severely for sloppy work processes and personal carelessness.
An Overview of JavaScript Testing in 2020
—This guide is intended to catch you up with the most important reasoning, terms, tools, and approaches to JavaScript testing as for the year 2020.
Why Did You Render v4 Released!
—TypeScript support, Custom hooks tracking (like React-Redux’s useSelector), Tracking of all pure components.
React Element’s “Parent” vs “Rendered By”
—A key concept of React we tend to forget, quickly explained.
SEO For Developers — A Quick Overview
—All you need to know about your role as a developer to improve your website’s position in Google search results.
CSS Theme Organization Best Practices
—The three levels of theme abstraction that would make your CSS themes invincible.
Babel.js Guide -Part 1- The Absolute Must-Know Basics: Plugins, Presets, And Config
—What is Babel and how to use it? What are presets and plugins, and in what order Babel applies them?
How To Keep Track of Your Pinned NPM Packages?
—How to document/comment why package.json packages are pinned to specific versions? How to enforce no one accidentally updates them?
Track React-Redux Redundant Re-Renders With “Why Did You Render” Version 3
—@welldone-software/why-did-you-render@^3 tracks redundant Hooks re-renders + React-Redux@^7 uses hooks = Great way to track React-Redux redundant re-renders!
Track Redundant React Hooks Re-Renders With “Why Did You Render” Version 3
—@welldone-software/why-did-you-render version 3 is released with many features, including tracking of React hooks issues.
An Overview of JavaScript Testing in 2019
—The web has evolved, and yes- Testing has too.
Beware of Missuses of CSS-in-JS
—A common, hard-to-find, issue I’d like to share with you.
Why Did You Render Mr. Big Pure React Component Part 2- Common Fixing Scenarios
—What to do with the many console logs you are probably about to receive when you start using @welldone-software/why-did-you-render?
Why Did You Render Mr. Big Pure React Component???
—Tracking unnecessary React component re-renders using the @welldone-software/why-did-you-render library.
The Open Source Community- The Great Spontaneous Distributed Collective Effort
—How to use complete strangers for your own benefit while making their own life better and even contributing to humanity?
An Overview of JavaScript Testing in 2018
—TL;DR; Use Jest for unit and integration tests and TestCafe for UI tests.
redux-toolbelt: Supercharge Your Redux
—10x less code, 10x more redux power - part 2 - the basics.
An Overview of Developer Tools for Windows
—An overview of tools that will help you program faster and become a code summoning wizard.
Clever Library Wrapping
—A Small Tip That Will Save You a Lot of Time, Bugs, and Rage.
An Overview of JavaScript Testing in 2017
—This short guide is intended to catch you up with the most important reasoning, terms, tools, and approaches to JavaScript testing.
How to Get Into the Web Development Field?
—tl;dr build a website and understand as much as you can about it. Here is a suggestion for something you can begin with.
How Can Aspiring Programmers Improve Their Chances to Find a Good Job?
—Two weeks of self-study are enough to give an aspiring programmer an edge over others competing for the same job.