Is the speed of this regular expression a concern? Are there opportunities for optimization?

Is the repeated execution of all these logical expressions in JavaScript causing performance issues? Are there any ways to optimize it?

\<[^\>]*?(abbr|acronym|address|applet|area|article|aside|audio|base|basefont|bdi|bdo|big|blockquote|body|button|canvas|caption|center|cite|code|col|colgroup|command|datalist|dd|del|details|dfn|dialog|dir|div|dl|dt|em|embed|fieldset|figcaption|figure|font|footer|form|frame|frameset|head|header|hr|html|iframe|img|input|ins|kbd|keygen|label|legend|link|map|mark|menu|meta|meter|nav|noframes|noscript|object|optgroup|option|output|param|pre|progress|q|rp|rt|ruby|samp|script|section|select|small|source|strike|style|sub|summary|sup|textarea|time|title|track|tt|var|video|wbr)[^\>]*?\>/g
javascriptregex

Answer №1

To optimize your code, consider prioritizing element names that appear frequently in your source code such as a and div. Moving them to the front of the list can improve performance:

… (a|div|abbr| …

If you want to ensure your pattern does not match certain elements like <notanabbreviation>, you may want to try:

<\b(a|abbr|…)\b[^>]*?>

The use of \b before the alternations helps the engine exit early without checking all possibilities.

It's always best to test your code for optimal results. You can view a performance test using nytimes.com as an example here.

https://jsperf.com/html-regex-purrformance

Answer №2

If you're looking to compare various regex patterns, check out this handy tool

This test analyzed Yahoo's front page source code in approximately 2.4 seconds. While not a rigorous scientific assessment, the results suggest room for improvement in efficiency.

Note: Silverlight plugin is necessary for this tool to function properly.

Answer №3

By placing the "i" after the "g", you can ensure that the search is case insensitive.

In addition, considering that this is in JavaScript, utilizing a hash may be more efficient than using a large regex.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Securing Credit Card Numbers with Masked Input in Ionic 3

After testing out 3-4 npm modules, I encountered issues with each one when trying to mask my ion-input for Credit Card numbers into groups of 4. Every module had its own errors that prevented me from achieving the desired masking result. I am looking for ...

javascriptangularnpmionic3

"Utilizing ng-select with ng-model: A Step-by-Step Guide

Currently, I am working on a code that involves using ng-repeat to loop through options. My goal is to utilize ng-select to choose a value based on a specific condition. However, according to the AngularJS documentation: ngSelected does not interact wit ...

javascriptangularjs

What steps should be taken to ensure Webpack stops execution and displays an error message when there are warnings emitted by j

How can I configure jshint-loader with Webpack to make the webpack command fail when JSHint emits warnings? I want to ensure that the CI build fails if any linting issues are detected. At the moment, my setup involves running jshint-loader on preload of ...

javascriptcontinuous-integrationjshintwebpack

Change the `display: none` of elements back to their original value

Explanation In my coding practice, I have implemented a script that hides certain elements if the user lacks the necessary permission to interact with them. To achieve this, I utilize the CSS property display: none. However, when it comes time to reveal ...

javascripthtmlcss

Generating Excel keys: duplicating/inserting cells among current columns for 1500 sets of data

I have the challenge of aligning different subtypes of data from two separate sets next to each other. Currently, each set of data is in its own rows with 1500 columns. To intersperse them, I've been manually moving cells from below up in between the ...

javascriptexceltypescriptexcel-formulaoffice-scripts

Removing items from a list with Node.js and Express using Mongoose

Having trouble deleting elements after retrieving them from the database with mongoose. I'm unsure how to select a specific element in the list for deletion. My app features a user list with corresponding ages. Check out my userview.ejs (updated afte ...

javascriptjquerynode.jsmongodbmongoose

Eliminate any spaces surrounding the text within the div tag

Is it possible to eliminate extra space at the end of text using CSS (or possibly JS)? I've experimented with various display properties, but none seem to be effective. I need to dynamically insert a blink-div at the conclusion of a multi-line sentenc ...

javascripthtmlcsswhitespaceremoving-whitespace

Mapping UVs for partial spheres in Three.JS

In a previous inquiry regarding the mapping of a stereographic projection onto a sphere for virtual reality live-streaming purposes, I delved into UV mapping techniques and successfully achieved a visually stunning result. However, there is one aspect of t ...

javascript3dthree.js

What causes errors with Bootstrap's Carousel left arrow but not the right arrow?

I recently finished designing this webpage The page is static and was built using Bootstrap's framework. The carousel functions properly, except for when you try to navigate to the left using the arrow button, it throws errors. Any suggestions on how ...

javascriptjquerytwitter-bootstrapcarousel

How can I pass the dynamically generated ID from PHP to AJAX/jQuery using an anchor tag?

I'm seeking help with jQuery and Ajax as I am new to it. My issue is that I have multiple 'edit' buttons in a table, one for each row's data. When I click on an edit button to modify the data, they all open at once instead of just the s ...

javascriptphpjqueryajax

Creating a concise JavaScript validation code summary

Managing user accounts on my browser-based HTML/Javascript/PHP system via an admin page has led to a complex form with nearly 20 input boxes. This one page now combines forms for new user registration, password recovery, password updates, and editing user ...

phpjavascripthtmlvalidationcss

Combining Components in NextJs Without Using Functional Components

I created a module, then split it into components and now I'm trying to piece it back together. The individual components are functioning correctly. Some components are nested inside the div of another component. I attempted to group them within a d ...

javascriptreactjsnext.js

What is the best way to scale down my entire webpage to 65%?

Everything looks great on my 1920x1080 monitor, but when I switch to a 1024x768 monitor, the content on my webpage becomes too large. I've been manually resizing with CTRL+Scroll to reduce it to 65%, which works fine. Is there a code solution using CS ...

javascripthtmlcssjoomla

Having trouble loading data.json file in React.js and jQuery intergration

Having a background in mobile development, I am relatively new to web development so please excuse any amateur questions. Currently, I am working on a react.js project using create-react-app (which utilizes Babel). I am following a tutorial that requires ...

javascriptjqueryjsonreactjs

Interested in concealing the delete and modify buttons of the formbuilder within the @formio/react component?

Reference Image const Formio = dynamic( () => import("@formio/react").then((module) => module.Form), { ssr: false } ); <Formio src={formJson} onSubmit={submitHandler} onChange={handleFormChange}/> In my Next.js project, I am us ...

javascriptreactjsnext.jsformbuilderformio

Tips for converting a URL to the correct route in emberjs when the location type is set to history

After creating a basic Ember.js application and setting the router location type to 'history', I encountered an issue with the generated URLs. Instead of the expected URL format like http://localhost/#/post/1, the Ember.js application was changi ...

javascriptnode.jsember.js

Choosing a specific category to display in a list format with a load more button for easier navigation

Things were supposed to be straightforward, but unexpected behaviors are popping up all over the place! I have a structured list like this XHTML <ul class = "query-list"> <li class="query"> something </li> <li class="query" ...

javascriptjquerycssmeteor

When running the `npm run dev` command, Tailwind does not seem to function

I have been given a task to create forms using tailwindcss, but when I try to run `npm run build`, it doesn't work. Can anyone assist me with this? npm ERR! code ELIFECYCLE npm ERR! errno 9 npm ERR! <a href="/cdn-cgi/l/email-protection" class="__cf ...

javascripthtmlcssdom

Manipulating HTML attributes with Jquery's attr() method results in returning [object Object]

Despite reading numerous articles and questions, I have yet to find a solution. My PHP page is designed to update an easypiechart using AJAX with database values checked every X minutes. For demonstration purposes, I have set the update interval to 10 seco ...

javascriptjqueryattr

Managing the lifecycle of a background worker in JavaScript (Node.js) - start and stop operations

I have a JavaScript function in my code that I refer to as a 'worker' which checks if it is running and performs some tasks class Application { async runWorker() { while (true) { while (!this.isStarted) ...

javascriptnode.js