Innovation in Action: Using Artificial Intelligence and Machine Learning to Transform Car Shopping
It’s safe to say that most people don’t find car shopping to be a pleasant experience.
From spending hours in a dealership to fretting about payment terms to completing piles of paperwork, most of us have experienced the nail-biting process that leads to finally being able to get behind the wheel of a new ride.
On the other side of the desk, dealers run into plenty of frustrations as well, trying to ensure a great experience for shoppers and move inventory off their lots, while still staying profitable.
Imagine being able to transform this process forever, impacting both how dealerships operate and how people find their dream cars. Tech employees at Cox Automotive have that opportunity by working on products like Esntial Commerce, an artificial intelligence retail technology that helps provide shoppers with an automated, 100% online financing process.
Esntial helps optimize the sales process, estimating payment in such a way that is appealing to both shopper and seller. It offers payment personalization based on the shopper’s risk profile, selected vehicle and preferred deal structure using an AI/machine learning algorithm. It offers actual financing and the ability to immediately transact online, meaning that customers can move forward confidently knowing that their financing has been approved.
Pretty cool, right? We wanted to know more about Esntial and what opportunities are available in this space, so we sat down with Isaac Hogue, Associate Vice President of Software Engineering at Cox Automotive, to get the inside scoop.
Hi Isaac, can you start by telling us a little about what makes Esntial special?
Sure. First of all, Esntial is a web-based platform that’s fully AWS on a serverless stack, so it’s the best of the best in terms of what an engineer would want to be working on. It’s also a really meaningful product in the marketplace, transforming how dealerships operate with a consumer-centric focus. It’s a win-win that hasn’t historically existed in the industry.
The phrase “artificial intelligence” really piqued our interest. Can you elaborate? What does AI have to do with Esntial?
We’re using machine learning to assess the marketplace and find opportunities to present to consumers and dealers when a car is being transacted. This product sits squarely in the machine learning space so if you’re interested in data science and modeling out different algorithms for machine learning, you’ll love what we’re doing here.
Tell us about the team that’s focused on Esntial right now.
We have about 250 people working on this right now, and 26 scrum teams. We’ve got a very diverse group of tech professionals, with people from all over the world.
What kind of job opportunities are available at Cox, specifically related to this product?
We’re primarily looking for web developers, web engineers, user experience experts, product owners, data engineers and DevOps engineers.
What’s next for this product?
It’s out in the market with a progressive release. The initial launch was last July and we’re ramping up to different clients this year. We’re primarily focused on the used car market, but in the future we’ll be turning our attention to new and certified pre-owned vehicles as well. We’re also working on building self-healing capabilities, asking ourselves how we can build reliability and resiliency into the product itself.
Last question: what’s your favorite thing about working at Cox Automotive?
I love that we’re working on something that makes a difference; not things that are just going to find their way onto a shelf somewhere. This is a place where you get to redefine the entire automotive industry.
Go Behind the Code with Cox and learn how you can join the team today.
Behind the Code and Facing the Challenge: Valentyna Yurtyn’s Story
Valentyna Yurtyn is Principal Software Engineer at Cox Automotive. Keep reading to learn about her experiences behind the code at Cox.
Valentyna Yurtyn is always up for a challenge.
She’s an active person who can often be found hiking, biking, going to CrossFit and swimming in the Pacific Ocean – and the promise of adventure was the very thing that attracted her to a career in technology.
“What brought me to software engineering is the challenge,” said Valentyna, Principal Software Engineer at Cox Automotive. “I enjoy the changing environment.”
If you’ve ever shopped for a car online, chances are you’ve interacted with Valentyna’s work. Her group develops and maintains high-traffic websites for Cox Automotive brands like Autotrader and Kelley Blue Book.
“Cox is ahead of the curve for things like native ads,” Valentyna said. “Sometimes I hear about companies doing things and I think ‘Oh, we’ve been using that technology for a while now; we integrated it a long time ago.’ We’re using a breakthrough approach. Our tech stack is wide and we have lots of different projects.”
Elaborating on the tech stack, Valentyna shared that her team builds micro-frontends with JavaScript ReactJS. For backend development, they build services using NodeJS, Microsoft ASP.NET Core and Java. All infrastructure uses cloud-based architecture with Amazon Web Services (AWS).
One of the most impactful projects for Valentyna’s team is working on web performance optimizations.
“Web performance has been at the top of the list in discussions within web developers’ communities,” Valentyna said. “Our company leadership made a commitment to focus on user-centric performance, and engineering teams work in coordination with ad sales, operations and product teams to identify performance opportunities.”
Valentyna’s team looks at different aspects of web performance and have been able to significantly improve user experience and performance metrics. They’ve driven server-side optimizations that improve response time and improve data query speed. They’ve driven content delivery network (CDN) updates for fast protocol, compression and image optimizations. They’ve driven UX and accessibility updates, like optimization of JavaScript bundles and improving cumulative layout shift (you can learn more about that project on our blog), as well as optimizations for analytics scripts and other third-party libraries.
“As I work on projects as a software engineer, I can see connections from start to finish and the results of the project,” Valentyna said.
Connecting business and technology
Valentyna didn’t originally plan for a career in information technology. Her background is in business, and she slowly merged into a tech career when she realized she enjoyed its pace and potential.
“My degree in business actually helped me quite a bit,” she said. “It’s beneficial to have an understanding of business and good coordination with product teams.”
Software engineering teams at Cox are knee-deep in collaboration, often working in cross-functional discovery groups with colleagues in UX, analytics, research and more. Valentyna said that’s why she loves hackathons – a fast-paced event where different teams join forces on a project.
“It’s new and exciting to work with the team in quick sprints,” Valentyna said. “Not all ideas lead to successful implementation but executing on ideas and running user testing allows us to stay current with ever-changing environments.”
Initiating change
These are particularly challenging times for Valentyna, who is from Ukraine. While she has lived in the US since 2001, she has many friends and extended family who still reside in her home country.
“It’s been really scary and painful to watch,” Valentyna said. “It’s been hard to concentrate on anything else.”
Valentyna stressed the importance of staying informed about the current situation in Ukraine, contacting elected officials, keeping perspective on the impact of economic sanctions on Russia and making donations (the James M. Cox Foundation is leading by example by giving $500,000 to the American Red Cross to provide humanitarian assistance to Ukrainian refugees).
“My biggest fear is that people around the world will get used to the war in Ukraine and move on with their lives,” Valentyna said. “Russia must be stopped. The war must be stopped.”
During a time filled with upheaval, Valentyna’s commitment to creating a meaningful impact stays the same, both at work and outside of it.
“To me, that’s what innovation means: responding to new environments and initiating change.”
Interested in a tech job at Cox? We’re hiring! Click here to see open positions.
Want to read more about Behind the Code? Click here.
Driving Inclusion at Cox Automotive: Part I
Written by Tessa Nadik, Sr. Director of Product Management, SEO & Content at Cox Automotive
When we assess the opportunity to take a new role, we may initially overlook the people who you spend the most time with: your potential coworkers.
Think back to the jobs you left over the years. What was the hardest part? For me, it was saying goodbye to people who became such a large part of my life. It was knowing I’d never travel to visit clients with my work bestie. It was knowing that my counterpart and I would no longer get to share mom advice during our weekly coffee runs.
Taking my current role at Cox Automotive, I have met so many wonderful and diverse people. Diversity in the workplace is such an important piece. Having a diverse group of people coming together to collaborate makes such a large impact and is so valuable not only to the members, but to the business as a whole. I’ve already learned a lot from so many at Cox. I’ve learned about things that can be applied to my work here and how I view and approach my life outside of Cox. I began to wonder if and how my diverse colleagues were finding the same benefits as I was.
Many of us know Cox has been recognized for being a top company in diversity and overall employee satisfaction. I have had the pleasure of working with many individuals with a variety of different backgrounds, ethnicities and cultures. Diversity and inclusion are something I value tremendously. I grew up in a very small rural town where diversity wasn’t something discussed or seen. My career has allowed me to grow my understanding and appreciation for the diverse cultures and communities that exist. Representing, attracting and retaining diverse talent is one of my top priorities. It is critical that diverse individuals from varied backgrounds have representation and seats at the decision-making table. For our business, we know that diversity is what drives the best products.
I decided to sit down with some of my Cox Automotive colleagues, learn their stories and share them on this blog. Stay tuned for part 2 of this series in the weeks ahead!
Spotlight on Arpit Gupta, Vice President of Product
Q. Can you tell me about your role at Cox Automotive?
I’m Vice President of Product for Kelley Blue Book and Autotrader. As a product leader, I’m always thinking about how to innovate and iterate new and existing ways of doing things to serve our customers best. That extends to culture– it’s important to create a culture of openness and gratitude, where every person feels empowered to take chances, fails to succeed, and learns quickly together in order to move forward.
Q. Do you identify as being part of any specific community? Whether culturally, ethnically, or otherwise?
I was born in New Delhi, India, so my heritage is Indian.
Q. How does your identity shape how you approach to work?
Growing up in India – a largely collectivist culture – and studying and working in the US have helped me develop my leadership muscle to be empathetic and consensus-oriented in my approach to collaboration and decision-making, while keeping an innovative and results-driven mindset. It has shaped my product philosophy, too: that every person has something to contribute and, in every product, there is opportunity.
Q. The way that inclusion and diversity are defined can vary slightly from person to person. How do you feel Cox approaches inclusion and diversity?
To grow an inclusive culture, strategy should always be iterating and evolving with the support of different voices. Cox is continuously working to strengthen its diversity and inclusion efforts. Cox’s ERGs, for example, create the space for teams to learn and celebrate the cultures and perspectives of their team members, to move the company forward.
Spotlight on Shanice Stewart, Senior UX Researcher
Q. Can you tell me about your role at Cox Automotive?
I am a Senior User Experience Researcher on the Consumer Solutions Team. I focus on helping product managers and designers improve the audience experience of the Kelley Blue Book and Autotrader websites and apps by gathering feedback from our users to be incorporated it into the designs.
Q. Do you identify as being part of any specific community? Whether culturally, ethnically, or otherwise?
Yes. Culturally speaking, I am the first America-born generation of my Jamaican family. I absolutely love my heritage from the reggae and dancehall music to the delicious Jamaican food. More generally speaking, I identify as Black.
Q. How does your identity shape how you approach to work?
I’m a firm believer in showing up in my authentic true self in all spaces, which means the workplace as well. It’s important to show others that you do not have to change who you are to excel in the workplace.
Q. What advice do you have for leaders who want to promote an inclusive culture?
Create and promote safe spaces for diverse groups. Spotlight each group and their strengths/accomplishments. Be sure to include these groups in internal mentorship and industry-recognized training programs to develop them in strategic and hands-on ways for excelling in their careers. It’s a worthy investment overall for a company and its individuals, both financially and culturally.
Interested in exploring jobs at Cox? See open positions here.
Learn more about Cox Automotive here.
Tech Highlight: Moving Oracle EBS to the Cloud
Cox Automotive’s technology teams are driving a better future through innovation. Keep reading for a behind-the-scenes glimpse into tech at Cox.
Written by Dan Webster, Senior Director of Technology @ Cox Automotive
At Cox Automotive, we have successfully moved Oracle EBS to the Cloud! That sounds impressive. But who really cares and what does that even mean?
Well, let’s start with the basics. Oracle EBS, or E-Business Suite, is an enterprise resource planning (ERP) platform that we use extensively across all of the Cox divisions to manage our finances, accounting and customer billing.
If you’re an aspiring technology professional, this may be the part where you yawn and glance toward your accounting major friends. But while finance functions may not sound exciting, they are critical to most every business. And at Manheim, where our auctions broker the sale of over 4 million vehicles every year, the technology to support these functions becomes strategic. When you account for the price of the vehicles, the purchased services, transportation, etc., we invoice for over $100 billion every year.
To make this even more interesting from a technology perspective, the dealer is often physically present at the auction site, with check in hand, waiting to pay for their car so they can drive it back to their lot immediately. This means our billing systems must integrate with our auction systems, title management and dealer financing systems all in real-time. Unlike typical billing processes which batch up their processing and send invoices overnight, our financial systems must be responsive and reliable throughout the day in order to meet the critical demands of our customers.
Enter the cloud.
As our infrastructure has aged and the need for an upgrade has arisen, we made the decision to migrate our Oracle finance, billing and business intelligence applications to the cloud for all the standard reasons (e.g., cost, flexibility, speed, etc.). However, while most companies migrate their ERP applications to the cloud via a pure “lift and shift,” we took a much more strategic outlook. This means that instead of simply replicating the existing infrastructure components with cloud-based counterparts and re-installing the packaged application, we refreshed and automated our entire infrastructure approach.
By leveraging the experience that we had gained from moving some of our custom applications to the cloud (e.g., Autotrader and Kelley Blue Book) we completely reinvented our ERP infrastructure team and adopted an infrastructure-as-code mentality. And just like that, our stodgy old ERPs joined the ranks of the hip, modern technologies generally associated with web applications. Instead of tweaking an infrastructure configuration any time we implemented a fix, installed a patch or added capacity, we modified our infrastructure code. Now we leverage modern tools like Ansible, Jenkins and FlexDeploy to make every software and hardware change an automated and easily repeatable process. When one of our many environments needs to be updated, we simply shut it down and recreate a new, updated version with the push of a button. When our applications are under heavy loads during the day, our scripts automatically increase computing power and I/O speed, and then reduce levels when demand drops.
Why is this cloud migration important?
The ability to rapidly recreate our hardware and software configurations provides a whole new level of resiliency and redundancy that hadn’t existed with our traditional infrastructure. Instead of spending weeks purchasing a new server or additional disk space while manually planning for additional demand, we can react almost immediately as our needs arise. This allows us to instantly meet business demand without significantly overpaying for unused contingency.
As our expertise continues to mature, we are taking advantage of more and more cloud features. Our disaster-recovery approach now relies on virtual compute power, which only needs to be spun up in the event of a disaster. In the near future, we will achieve a state where we hot swap between cloud regions during every bi-weekly release, further reducing risk by decreasing deployment time, simplifying release rollbacks and exercising our disaster-recovery capability every two weeks instead of once a year.
In other words, while most companies are driving their ERPs around in the equivalent of a wood-paneled station wagon, we are cruising ours in a self-driving sports car.
Interested in exploring technology jobs at Cox? See open positions here.
Learn more about Cox Automotive here.
Tech Highlight: Classic Load Balancer vs Application Load Balancer in Amazon Web Services
Cox Automotive’s technology teams are driving a better future through innovation. Here’s a sneak peek into the digital magic that drives two of the industry’s most well-known car-shopping websites: Kelley Blue Book and Autotrader.
Written by Meena Bala, Principal Software Engineer, Cox Automotive
The high traffic consumer-facing sites, KBB.com and Autotrader.com, run on Amazon Web Services (AWS).
To give the best user experience for our visitors, our engineering teams strive for high availability and responsiveness of both websites. To prevent server overload, we distribute traffic using a load balancer. Initially, our apps were setup to use Classic Load Balancer (CLB). After reviewing some of the many advantages of an Application Load Balancer (ALB), including Layer 7 of Open Systems Interconnection (OSI) Model, health monitoring, security features, and setting target groups, we chose to switch our apps to use Application Load Balancer. Below is the comparison of AWS Classic vs Application load balancer.
What is load balancing?
Load balancing distributes incoming application traffic across multiple available servers. This helps to improve application responsiveness and prevents server overload. A load balancer checks the health of the servers and sends traffic to the servers that can handle the requests to ensure scalability and availability of services.
About the Classic Load Balancer
Classic Load Balancer provides basic load balancing across multiple Amazon Elastic Computing (EC2) instances and operates at both the request level and connection level. Classic Load Balancer is recommended only for EC2 Classic instances. Layer 4 or Layer 7 Load Balancing of OSI, SSL Offloading and IPv6 Support are features of Classic Load Balancer. It does not support host and path-based routing.
About the Application Load Balancer
Application Load Balancer allows a developer to configure and route incoming end-user traffic to applications based in the AWS public cloud. It operates at the seventh layer of the (OSI) model. At Layer 7, the Elastic Load Balancing (ELB) can inspect application-level content, not just network packets. This allows the load balancer to route traffic based on more complex rules such as the path of the request to targets.
What are the benefits of migrating to the Application Load Balancer?
- ALB operates at layer 7 and supports a variety of communication protocols – HTTP, HTTPS, HTTP/2, as well as WebSockets.
- Request forwarding based on the URL path can be configured with the help of ALB rules.
- Single load balancer can handle routing for multiple domains.
- You can route based on fields in the request, such as HTTP header conditions and methods, IP addresses, etc.
- Lambda functions can be registered as targets.
- Priorities can be set to decide the order to evaluate the rules.
- User authentication can be done for your applications before routing requests.
- Dynamic port mapping is supported using the EC2 Container Service.
- It simplifies and improves the security of your application, by ensuring that the latest SSL/TLS ciphers and protocols are always used.
- Though both CLB and ALB support health checks, ALB allows detailed error codes to be configured.
- Attaching a target group to an Auto Scaling group enables you to scale each service dynamically based on demand.
- Request tracing can be added to the HTTP requests from clients to targets.
- Web Application Firewall can be used to monitor web requests and protect the application from malicious requests.
- ALB supports slow start mode which helps to add new targets to ramp-up without overloading requests.
Comparing the benefits of AWS Application load balancer vs Classic load balancer, ALB is preferred if you need more complex load balancing and CLB can be used when using EC2 classic instances only.
To hear more about what else our engineering teams have been up to, stay tuned for future blog posts!
Interested in exploring technology jobs at Cox? See open positions here.
Learn more about Cox Automotive here.
Tech Highlight: A Study Guide for the AWS Security Specialty Exam
A culture of security is always a top priority for Cox’s technology teams. In this blog post, the engineering team at HomeNet – which is part of the Cox Automotive family of brands – details how Cox’s tech employees leveled-up their AWS security skills.
Written by Arthur Kay, Principal Software Engineer, Cox Automotive
Security is always a top priority for the Cox Automotive product portfolio. Our VP of Engineering, Roger Vidal, reminds us during every all-hands meeting that our commitment to stability and security builds strong relationships with our customers today and builds trust in our brand for the future.
A little more than a year ago, we formed the IMS Security Guild – a volunteer group of engineers and practitioners from across the organization who champion the “security-aware mindset.” Our goal is to create a culture of security, and we identified some core values that Cox Automotive emphasizes with every product release:
- Software that is secure is of higher quality than software that is not secure. Our customers trust us to keep their data safe, and Cox’s reputation depends on the security of our products.
- Secure software is built by people, not just scanned by tools. Although tools can help us, we must educate, train, and mentor our people to deeply understand security in order to build a culture in which everyone participates.
- Everyone is accountable for security. Security is a constant effort, and every person has a responsibility to ensure guardianship of their information, products and applications.
Keeping in mind our mission and core values, the IMS Security Guild has promoted various training opportunities and security-focused activities during 2021.
AWS @ Cox
Cox Automotive has been using AWS as our preferred cloud provider for a number of years, and we’re actively migrating major legacy systems to the cloud. Our software engineers have become intimately familiar with AWS and related technologies, and our executives have actively encouraged us to become AWS certified.
This year, the IMS Security Guild wanted an outside-the-box idea to encourage our engineering teams to level-up their security skills in a meaningful and applicable way. We decided to create a self-paced study group for the AWS Security Specialty exam, with the goal of having at least 5 people achieving certification by the end of the year.
AWS Study Group
Cox Automotive is a broad company that encompasses many tech teams; we have physical offices various time zones, not to mention dozens of folks who work remotely full time. So it was no surprise that running a study group resulted in some challenges. Simply finding a time on the calendar was a challenge in itself!
Another challenge we faced was the fact that not every software engineer or practitioner at Cox uses all of the parts of AWS covered by the exam. Every person in our study group came into things with a different level of AWS experience. We used video content available in Pluralsight to drive our study group, but not every developer was familiar with EC2 or Lambda or KMS.
Additionally, Cox Automotive abstracts certain features of AWS (namely IAM) away from our day-to-day product engineering, so some of our hands-on experience building software in AWS doesn’t perfectly align with the course content and the certification exam.
Study Resources
If you are going to consider studying for the AWS Security Specialty exam, here are some resources we would recommend based on our experience.
Pluralsight
Our study group originally started by following the AWS Cloud Security “skill path” in Pluralsight, which is a collection of shorter courses by various content creators. We also watched Architecting for Security on AWS by Ben Piper. Generally speaking, those two Pluralsight resources were great. They gave us a wonderful baseline for security across AWS, though in hindsight they were not deep enough in several areas to prepare us for the certification exam.
We supplemented our study group with some popular YouTube videos, including a number of presentations from AWS re:Invent and other industry events:
- AWS re:Invent 2020: Instance containment techniques for effective IR
- AWS re:Invent 2020: Best Practices for securing your multi-account environment
- AWS re:Invent 2019: Using AWS KMS for data protection, access control, and audit
- AWS re:Inforce 2019: The Fundamentals of AWS Cloud Security
- AWS Security Virtual Roadshow 2020: Data Protection using Encryption in AWS
- SANS DFIR Summit 2017: IR in the Cloud (AWS)
- Introduction to AWS Certificate Manager Private Certificate Authority (CA)
We also discovered a fantastic blog post from Capital One which highlights a number of other resources. We specifically took closer looks at the AWS documentation and whitepapers for KMS. Last but not least, we highly recommend the WhizLabs practice tests, which really prepared us for the final exam!
Conclusion
If you’re interested in AWS Security, you might consider searching for open positions here at Cox Automotive! The organization is always encouraging us to learn, grow and contribute in innovative ways — they’ll even pay for you to get your AWS certifications!
Interested in exploring technology jobs at Cox? See open positions here.
Learn more about Cox Automotive here.
Tech Highlight: Improving Cumulative Layout Shift score for Kelley Blue Book
In this blog post, the engineering team at Kelley Blue Book (KBB) – which is part of the Cox Automotive family of brands – walks you through recent web performance optimizations for KBB.com home page.
Written by Valentyna Yurtyn, Principal Software Engineer, Cox Automotive
Our engineering teams develop and maintain several high-traffic consumer web sites, such as KBB.com and Autotrader.com. We aim to combine frictionless user experience with quality, trustworthy content to meet our vision of transforming the way the world buys, sells, owns and uses cars.
Web performance analysis helps us understand how visitors perceive our site performance and measure impact of updates to user experience. Over the last year, our engineering team has worked on various aspects of web performance. Keep reading to learn about the changes we have implemented to reduce Cumulative Layout Shift for KBB.com home page.
Cox employees collaborating at work
What is Cumulative Layout Shift (CLS)?
According to this Google Developers Article, “Cumulative Layout Shift (CLS) is an important, user-centric metric for measuring visual stability…” The metric flags shifting of content that happen without user interaction and as such is considered unexpected by visitors browsing the site.
In the screenshot below, you can see how even a small 50px shift of the element marked with the blue border moves the element marked with the red border down, below its initial placement. As we have all experienced, it is frustrating to accidentally tap on the wrong place or lose focus when the text you started reading unexpectedly shifts. Optimizing CLS score helps avoiding such situations.
To guide us with suggestions on performance improvements, our engineering team utilizes Lighthouse. This open-source automated tool audits page performance and can be run against any web page in Chrome browser DevTools, as well as from command line, or as a Node module. Cumulative Layout Shift is one of six performance metrics tracked by Lighthouse. While the CLS metric accounted for only 5% of the Performance Score in previous versions of Lighthouse, current version 8 updated its weighting to 15%, as can be seen in the Lighthouse Scoring Calculator. Additionally, in 2021 Cumulative Layout Shift metric was included in Google page experience signals as part of Core Web Vitals. Because of the increased emphasis on CLS in Lighthouse and Core Web Vitals, we chose to focus on this metric as a part of our overall performance effort.
The CLS metric is most successful when approaching zero. The lower the CLS score, the less unexpected shifting our visitors see when browsing a page. Thus, our goal was to get the CLS score as close as possible to zero for the most pleasant user experience. As the first step, we decided to optimize Cumulative Layout Shift for the initial (first) viewport – the visible area of the web page and page elements as they come into view and before visitors start interacting with the page. We defined 4 primary areas of improvement: optimizing fonts, server-side rendering styles, adding stability to visual elements on the page and optimizing advertisement modules.
Optimizing fonts
Layout shift related to fonts is usually caused by a slight delay in displaying text with custom fonts (so called “Flash of Unstyled Text”). To display page content as soon as possible, browsers display text with default fonts while downloading custom fonts. When custom fonts become available, browsers apply them to text. The difference in width between default and custom fonts can be significant, causing re-adjustment of text sections of the page.
The screenshot below illustrates how applying custom font to the “Shop Smart – Step by Step” heading causes the text to wrap onto the next line, and shifts the module marked with the blue border below its initial placement:
To address Flash of Unstyled Text, we tested out multiple configuration settings for web fonts and decided on the following setup:
- Load custom fonts from Google Content Delivery Network.
- In addition to custom fonts, add generic family names to “font-family” in CSS that are the closest to our custom fonts by width.
- Set “font-display” value to “swap.”
- Preload custom fonts used in the first viewport.
Even though layout shift with this setup is still possible, these changes minimized layout shift related to fonts.
Page CSS
Layout shift related to styles is usually caused by a slight delay in loading and applying styles (so called “Flash of Unstyled Content”).To avoid a performance impact from downloading external CSS stylesheets, we render styles on the server with the help of Emotion library. With this approach, browsers receive page HTML document with all styling embedded and can efficiently parse and display HTML content.
Minimizing shift for visual elements
Some of the layout shifts for visual elements can happen when server-rendered HTML elements such as img or iframe lack dimensions. Initially rendering such elements with width and height of zero, browsers adjust their dimensions when loading is complete. We were able to improve user experience and prevent such layout shifts by implementing styling rules and adding width/height or aspect ratios to all the images, frames, or their parent containers.
Another potential culprit of increased layout shift and worse user experience is client-side processing. We use React library, and all content rendered on the server goes through additional processing in the browser (client-side); all events are attached, and additional content or data is loaded after network requests. It is important to minimize pushing the content down or collapsing elements during such client-side processing.
We evaluated all modules visible in the first viewport that load in part or entirely on the client and implemented a set of rules to improve CLS and user experience:
- Reserve room for dynamic modules by using “min-height” and “min-width” CSS properties.
- Create skeleton images that closely match the final look of dynamically loaded modules.
- Add initial state to the modules along with loading indicators so that visitors are aware whenever the content is still getting loaded and updated.
- Minimize any updates to visual elements dimensions that are not clearly expected or initiated by our visitors.
An example of a big win with decreasing our CLS score associated with client-side processing was a change we made to an expander component. The expander used to render about 200px of text first, only to collapse this text to 50px of height a second later. By rendering the expander component in collapsed state on the server, we fixed subpar performance of the expander component, lowered our CLS score and ensured our page visitors had a better experience!
Improving advertisement modules
Advertisement content deserves its own section in this blog post, as ad content can be one of the largest contributors to layout shifts. With most ad rendering happening on the client, and ad publishers sharing some of the prominent and highly visible page placements, maintaining satisfactory user experience is particularly important.
Kelley Blue Book uses Google Ads/Google Publisher Tags (GPT) to serve advertisement content. Even though ad slots may be rendered server-side, ad fulfillment always happens on the client. When advertisement creative is displayed within an iframe it is excluded from CLS metric measurements, however advertisement containers themselves are always included in the metric and should be optimized. This article from Google suggests some ideas of how to minimize layout shift from advertisement.
In collaboration with ad sales, operations, and product teams we implemented several important updates to lower layout shift related to advertisement:
- Ad product team established single size ads as much as possible (as opposed to rendering multiple ad sizes). When different ad sizes are allowed to render in the same spot, layout shifts become quite common as we cannot predict which ad size will end up getting fulfilled from the ad server.
- Engineering team styled advertisement containers to fit the expected advertisement size. For example, we updated containers hosting a medium rectangle 300x50px ad to have “min-width” of 300px and “min-height” of 50px.
- Ad operations team created ever-green native content to display in advertisement slots when sponsored content is not available, so that advertisement slots never need to collapse. This was a change to our previous strategy of collapsing unsold advertisement slots to free up screen space in mobile devices.
- Engineering team implemented consistent styling and placement for advertisement labels.
Looking at the end-result of our efforts, you can tell that the homepage now maintains good visual stability of HTML elements:
Example of updated first viewport
Validating the changes
We validated all changes by running Lighthouse tool and tracking improvements of Cumulative Layout Score value (part of Lighthouse Performance Score). After working through all optimizations not only we achieved the best possible CLS score of zero, but also established a set of best practices to maintain this perfect CLS score in the future.
Filmstrip in the Lighthouse report below shows how visually stable KBB.com homepage is after all our updates:
Next Steps
We should consider that CLS metric in Google Lighthouse measures only layout shift within the first viewport and does not emulate user scrolling down the page or interacting with page elements. However, as part of the Core Web Vitals, CLS metric is “…measurable in the field, and reflects the real-world experience.”
I plan on covering Core Web Vitals CLS optimizations in my next blog post, so stay tuned to learn more about the inner workings of Kelley Blue Book Engineering team!
Learn how Cox Automotive technology teams are building a more connected and mobile future here.
Are you interested in joining our engineering team? Explore open positions here.
How Mo hits home runs in sales at Cox
Based in Mission, KS, Mo Zahabi is committed to building next–generation leaders through a culture of inclusion and diversity, as well as a clear focus on team member career pathing. Keep scrolling to learn about his experiences working in sales at Cox Automotive.
The field of dreams
There’s no shortage of sports lingo and analogies in the world of sales. From the inherently competitive nature of the business to the fact that you need a team of A-players to succeed, there are plenty of parallels between both worlds.
Sports play a huge role in the life of Mo Zahabi, Associate Vice President of Sales Engineering at Cox Automotive. When asked about what he enjoys most outside of work, Mo’s answer was “Being on a baseball field.” He also spends most of his free time on a baseball or softball field supporting his children’s athletic talents.
“What I do for fun is hang out with my kids,” Mo said. “It’s one of the reasons why I work so hard, and it makes my time with them more enjoyable.”
Developing talent
Mo began his career with Cox Automotive in 2008. Drawing from his background in technology, and his father’s 40 years of experience in the automotive industry, Mo has created a personal brand of leadership that allows him to be the liaison between product and sales.
Mo considers himself a solution architect who “builds value in our products and solves problems before they occur.” Although his role is focused on heavy research and subject matter expertise, he has never lost focus of his number one asset: his team members.
“I just like to see people succeed,” Mo said. His open-door policy to assist team members with career pathing extends to all who are interested, as he recognizes this as an important tool in developing the next generation of leaders. Mo stressed Cox’s policies of honest transparency when he said: “You don’t have to wait for a mentor to pick you, as our leaders are passionate about giving back.”
The open and honest feedback that is provided to Mo’s direct reports have created a culture of leadership through accountability and collaboration. No team member is left alone to solve a complicated problem. Instead, they are encouraged to pursue help to seek resolution as a team.
Creating partnerships
When it comes to being a sales leader, Mo recognizes the importance of teamwork, diversity and ensuring that everyone’s voice is heard.
“We’re looking at each other like partners who are collaborating on what’s best for our customers, and where product advancements exist.”
The accessibility of Cox’s leaders has motivated Mo to extend the same support to his team, where a collaborative environment welcomes ideas and questions from all team members and creates an opportunity to continue the process of building each other up.
When asked where he saw himself in five years, Mo once again stressed the importance of leadership: “Developing future leaders who want to be in my seat” was his response.
Developing next-generation leaders is important, but so is work-life balance. As a family man with two children heavily involved in competitive sports, Mo appreciates the variety of benefits to promote work-life balance at Cox, such as flexible work policy, flexible PTO, accommodating schedules, paid volunteer hours, and more.
“You can’t buy back memories, and you only have so much time to create them,” he said.
Whether he’s in his office or on a field, Mo has an instinct to support those around him and invest in their talents.
Interested in Cox sales jobs? We’re hiring! Click here to view open positions.
Interested in learning more about the salespeople who drive Cox forward? Check out the rest of our For the Love of Sales series and follow along on social media using #ForTheLoveOfSales.
How Chrisey fulfilled her lifelong dream
Chrisey Bell is Vice President of Sales for Inventory Management Solutions at Cox Automotive. Her passion for the automotive industry and problem-solving merged when she began a career at the company that is changing the way the world buys, sells, owns and uses cars. Read her story below.
An automotive ambition
When Chrisey Bell was a child, she was obsessed with cars.
She has vivid memories of visiting a McDonald’s near her childhood home when she was seven or eight years old and staring out the window in fascination at the car dealership next door. She was enchanted by the rows of shiny cars and the bustle of activity on the lot, and decided that she wanted to work with cars when she grew up.
“I saw new cars and fell in love with them and thought that I wanted to be a car salesperson,” Chrisey said. “I was just so interested in automotive.”
When she got a little older, Chrisey wondered if a career in some kind of automotive engineering might be a good fit for her. After all, she had a knack for problem-solving and taking things apart to see what’s wrong with them. She ended up sticking to her original dream of working in sales, but that gift for getting to the heart of an issue has still served her well in a role at Cox Automotive.
“When something is wrong or isn’t working, I really ingrain myself in understanding the root of the problem,” Chrisey explained. “One thing that’s been really interesting to me in working on the front lines of the field is hearing dealer feedback and understanding their pain points, and then seeing different teams in Cox Automotive coming together to solve the challenges of car buying and selling. We try to be a great partner for our dealers.”
20 years and counting
Chrisey is Vice President of Sales for Inventory Management Solutions. 2021 marks her 20-year anniversary with the company, during which time she’s held eight different positions with multiple geographies, and met her husband, who is also a Cox Automotive employee.
“It’s crazy that 20 years has flown by,” Chrisey commented. “Working here is so much more than just a job; it’s the opportunity to have a successful career that you’re in control of. Having a sales position at Cox, you can find areas you’re really passionate about and have a career in multiple areas within one company. That’s something special.”
To Chrisey, another special thing about working in sales at Cox is the company’s commitment to investing in people.
“I’m so grateful that I had the incredible leaders in my career to help me grow and develop,” Chrisey said. “That’s what motivates and excites me every day to help cultivate the next generation of leaders. Not only did Cox invest in me in terms developing sales skills, but they also covered the cost of my master’s degree. That was incredible for me to go through my educational process of getting my degree in e-commerce.”
A pro-sales, people-first culture
Chrisey said that Cox’s pro-sales culture sets it apart as a place to work.
“Our sales department has such a critical role in how we run our business,” she said. “We bring back the voice of the customer to other aspects of the company, driving decisions we make on a daily basis. That’s recognized throughout the organization. We’re not making decisions in silos – sales is an important feedback mechanism.”
Chrisey added that she can’t imagine working anywhere else in the automotive industry.
“We have such great people, top-notch solutions and incredible leadership. I truly believe that we continue to put people first; just think about the benefits we receive. It goes beyond 401k and health benefits; Cox does so much to address the needs of individuals. People are treated well, and it comes from this incredible family that leads our company and puts employees first. Until you work here, you don’t get to realize how important and special that truly is.”
Interested in Cox sales jobs? We’re hiring! Click here to view open positions.
Interested in learning more about the salespeople who drive Cox forward? Check out the rest of our For the Love of Sales series and follow along on social media using #ForTheLoveOfSales.
13 Questions with…
Alan Campbell, Mobile Auction Support Manager at Cox Automotive
Working at Manheim – part of the Cox Automotive family of brands – Alan Campbell helps deliver an extraordinary experience to clients across the nation, living up to Manheim’s mantra: “Our mission is yours.” He’s also the founder of a non-profit, an avid basketball fan and the subject of our latest “Questions With” employee interview series. Keep scrolling to see his conversation with Elizabeth Saulsbury from Cox’s Employment Brand team.
Elizabeth: Hi Alan, and thanks for chatting with me! You and I are both in Atlanta and we are nearing the end of the workday here on the east coast. What are your plans after work today?
Alan: Hi Elizabeth! Well, let me see…I run a non-profit so I usually spend an hour on that after work, and then it’s family time. We’ll watch a show or movie together while we’re cooking dinner so it’ll be a nice relaxing evening.
E: Tell me about the non-profit. You’ve had some exciting stuff happening with that lately, I hear?
A: Yeah! It started out as a commemoration for my dad, giving away scholarships to graduating high school seniors. And since we started that in 2015, it has evolved into a mentoring program, and we’re going to have our first cohort class in January 2022. It’ll be virtual with Westlake High School in South Atlanta. We’re going to teach them skills that they may not learn in school, like financial literacy, special STEM skills like coding, public speaking, mental health, imposter syndrome…just trying to equip them and prepare them for college. And at the end of the program, we’re going to award them scholarships.
E: How wonderful! What’s the name of your non-profit?
A: It’s called the Nolij Foundation Inc. – the phonetic spelling of “knowledge.”
E: Now, I’m told that you had an exciting run-in with Microsoft this week and that you’re even the subject of an upcoming mini-documentary. Give me the details!
A: Yeah, so here’s the story. Someone nominated me for a home office upgrade and a potential partnership with Microsoft for the mentoring program. I think it was my brother, but I won’t know until the documentary is done. And I won! They came over to my home and gave me a suite of Microsoft products just to make me more efficient and productive and they filmed a mini-documentary about Nolij and even involved some of the students. So it’s pretty cool.
E: That’s incredible! What’s your favorite product they gave you?
A: I would say the headphones, and also the Surface Pro X I’m using right now. It’s pretty nifty.
E: You mentioned that after work is done, it’s family time and TV time. Tell me a TV or movie character that you really relate to.
A: Oh my goodness…
E: Aha, I stumped you.
A: Well, I can actually start with my favorite movie, which is The Family Man with Nicholas Cage. I love Nicholas Cage and in the movie, his last name is Campbell as well. My original goal of trying to work on Wall Street is what he does, and there’s a lot of symbolism in that movie that correlates with my life. And I would probably also have to say Jim from The Office.
E: A classic.
A: Yeah. My personality is like Jim’s. I love that show; I’ve seen it a million times and Jim is that fun guy who can also get work done when he wants to, and that feels like me.
E: Speaking of the office…like many people, you’ve been working remotely since the start of the pandemic. Do you miss being in a physical office, or do you love working from home?
A: I think I’m in between. When it first started, I was like ‘I love this’ but as the months started to pass, I’ve had more trouble focusing. When my wife and son were home during the heat of the pandemic, and somebody would be watching TV or something and I’d be like “turn that down” or my son would be upstairs throwing a basketball against the wall or something…it was chaotic. Now, I’ve found an equal balance. So I guess the jury is out. I love being at home but I also love being around coworkers.
E: I feel the same way. How long have you lived in Atlanta, Alan?
A: Oh gosh…I’ve been here since 2008. I came up here after I graduated from Columbus State.
E: What’s your favorite spot for pizza here?
A:You’ve got to go to Antico. I think the staple location is the one near Georgia Tech, but at any location, the pizza is incredible. My wife is half Italian so we found that place and fell in love with it.
E: As much as I love talking about pizza, it’s time to switch gears a bit. What do you love most about working in the automotive side of Cox?
A: I would say the interactions with dealers. Working in automotive is much different than my background, which was with AT&T. You’re around a lot of people, but working with dealers is such a specific thing. Learning about their businesses and how they’re in the community…and how we can bring solutions from Manheim to them. It’s challenging but fun, because every dealership is unique and works in different ways. I love hearing their stories.
E: There are lots of different businesses within the Cox ecosystem. What’s one area of the company that you’d love to learn more about?
A: Because of my background, I’m very interested in what’s going on with our media side of the business at Cox Communications. What they’re doing with TV and mobile and retail. It would be interesting to learn more about that.
E: You’ve mentioned before that you love basketball and that it’s a big part of your background. What’s something that your upbringing in sports taught you that you think everyone should know?
A: I would say that a hard-fought lesson is that the best players have amnesia. What I mean by that is that when you make a bad play, you can’t dwell on it. If you continue to linger on that bad play or bad game and beat yourself up about it, you won’t be able to move forward. I try not to focus on the past, but on what I can change in the future.
E: One last question for you. What advice would you give to someone who’s looking for a job at Cox?
A: If you want to work at Cox, be prepared to be in a different type of environment – and I mean that in a good way. I’ve been amazed by the culture here. I would advise anyone who wants to work here to expect something different. Don’t come into the company trying to be a polished person – just come into the company trying to be your best self.
E: Thanks for the conversation today, Alan. It’s been great getting to know you!
A: Likewise. Take care!
Interested in learning more about Cox’s culture? Click here.
Cox Social Networks
