How to fix webpage error. Web page errors and how to find and fix them Application profiling with the UI response tool

09.03.2022

While browsing the Internet, Internet Explorer may display messages that the page contains errors and may not display correctly. Let's look at a few ways to fix this problem.

Instruction

If there are no visible difficulties in the browser, except for an intermittent error, you can try turning off script debugging so that the message does not appear again (if the error appears on more than one site, but on several sites at once, proceed to the next step). From the Tools menu, open Internet Options, select the Advanced tab, and check the box next to Prevent script debugging. If you need to turn off the notification of all errors, uncheck the "Show notification of each script error" checkbox.

Try opening the site that is causing the error while browsing from a different account or from a different computer to see if the problem is local. If the error appears, it is most likely caused by incorrect web page code. In this case, you can disable script debugging by following the instructions in the previous step. If the problem disappears when browsing the site using a different computer or account, continue to the next step.

It is possible that Internet Explorer does not block active scripts, Java and ActiveX, which determine the display of information on the page at the time of browsing. To fix the problem, you need to reset your browser security settings. To do this, in the "Tools" menu, select "Internet Options" and go to the "Security" tab. Click the "Default" button and then "OK". If the problem persists after relaunching the page that was causing the error, try the next method.

As you know, the browser stores temporary files and copies of pages in a separate folder for subsequent access to them. If the folder size becomes too large, some pages may display errors. The problem can be solved by periodically clearing the temporary files folder. To do this, open the Internet Options dialog box from the Tools menu. On the General tab, in the History group, click the Delete button. Check the boxes for Temporary Internet Files, Cookies, History, Web Form Data, and click OK.

There are, of course, others - I will definitely mention them.

Firebug for Firefox

I don't know for sure whether firebug the progenitor of other developer tools, but it is definitely the most popular, convenient and functional to date.

Firebug is an add-on for Firefox, which means it must be downloaded from the Firefox add-ons site and installed.

In order to call the firebug, just press F12.

Features of this add-on:

Inspection and editing of dynamically changing HTML;
CSS editing on the fly;
Debugging JavaScript, command line for executing scripts;
Monitoring of network requests - you can see the size and download time of files and scripts, request headers;
DOM parser.

You can talk about these features in detail for a long time, but I think that they are known to all our readers, and if not, detailed information is on the Firebug home page or the same is translated by Ilya Kantor.

In addition to firebug itself, you may need a useful lotion for it - firecookie, with which (surprise:-) you can view and modify cookies.

WEB Developer Toolbar for Firefox

Another useful addition to Ognelis. It looks like this:

Let's go through the points.

Disable

Allows you to turn off JavaScript, disable the use of the cache, which is very useful in development (allows you to be sure that the page loaded with the latest updates), cancel the colors used on the page and replace them with standard ones, disable sending in the referrer header (the page from which the transition was ).

Cookies

A useful option for working with cookies: they can be viewed, deleted, blocked and added.

css

This menu holds the Developer Toolbar's coolest feature - on-the-fly CSS editing. In addition, it is possible to view css, disable, and so on and so forth. In my opinion, the presence of keyboard shortcuts is very useful here (CTRL + SHIFT + C, for example, allows you to immediately go to viewing page styles)

Forms

Everything for working with forms: show passwords, show information about forms, convert form methods (GET » POST and vice versa) and much more. A useful function "Populate Form Fields" for automatically filling in form fields (for example, when testing a site when the password remembering function is disabled. Otherwise, I don’t see anything useful in this paragraph.

Images

There is a useful function to turn off images - to see what your site looks like without images. Pictures can be circled, show their sizes, show alt-attributes.

information

This menu has a lot of options. It can be useful to display the class and id attributes on the page. In addition, the “View Color Information” item is interesting - to quickly get information about the colors that are used on the page. "View document size" - view page size. "View Response Headers" - view the page headers.

Miscellaneous

The most commonly used feature is clearing the cache. In addition, the "Page ruler" - ruler, "Page Magnifier" - magnifying glass and "Line guides" - a few lines are available here, which can be useful to trim the template.

outline

Selection of different page elements - tables, headings, links, frames, blocks. Resize allows you to resize the browser window to fit any standard screen extensions. Tools here are stored features for page validation. Both local and external. Convenient and quick access to validate HTML, CSS, and more. You can use the CTRL+SHIFT+H keyboard shortcut to validate HTML.

view source

View source code. Ability to view in an external application, view the generated code.

The one on the right is my favorite. It's a fast HTML, CSS validator and JavaScript error indicator. If there are no problems, the icon is green, and if there are problems, it is red.

Internet Explorer Developer Toolbar

Starting from 8.0 error debug is already built into this browser. It is easily called F12 key. True, he is miserable as a program of the 90s.

But there is a much cooler tool for this browser, the so-called Internet Explorer Developer Toolbar can be downloaded from the link.

In appearance, this toolbar, of course, looks like firebug, but, alas, it has not grown up to it yet. Although, on the other hand, it has some features that the firebug does not have. I would call Internet Explorer Developer Toolbar some hybrid of Firebug and firefox web developer Toolbar.

Like in firebug, it is possible to inspect an element with a simple click. But, if we can immediately see paddings and margins, then there is no such possibility here.

Also, the Internet Explorer Developer Toolbar does not dynamically update the element tree, as Firebug does. That is, if we change something on the page using js, we will not see anything using this toolbar.

From what you can enjoy - changing CSS on the fly (an easy way to find what to hack :), the ability to disable CSS and images, the ability to quickly clear the cache and play with cookies, quick access to validation.

The most delicious: there is a built-in color picker that allows you to get any color from the page using an eyedropper. (for ff there is a separate ColorZilla plugin).

Debug Debug Bar for Internet Explorer

You can download DebugBar for Internet Explorer from the given link.

An interesting extension in its own right. Installed as an additional panel to the browser:

For some reason, there is a built-in search engine, an eyedropper, the ability to resize the window and, again, for some reason, the ability to send a page to a friend for soap. Although it might be useful. But I failed to take advantage of this opportunity.

In addition, there is an inspector:

The method of inspection by clicking or pointing did not suit the developers: they came up with a more interesting thing. In the DebugBar, you need to drag the target to the desired element to see it in the tree. There is no option to edit CSS. But there is a validator and a built-in js console.

And if you dig into the settings, you can find this:

Both funny and sad.

It is known that the Developer Toolbar will be built into the eighth explorer. It will be similar to the one described in the third paragraph, but we hope that it will be better.

Debug DragonFly for Opera

DragonFly has been built into Opera since version 9.5, so there is no need to install it. In order to activate Dragonfly, go to Tools → Advanced → Developer Tools. And if in English, then Tools → Advanced → Developer Tools.

I will immediately warn you that DragonFly is in the Alpha2 stage, this explains many of its glitches.

Features list:

DOM inspector;
Click Inspection (again, we won't see padding like in FireFox);
Editing;
Quick access to the error console.

DF is something like a separate page in a frame. If you open it, it will be open for all tabs (unlike firebug). Therefore, before inspecting an element, we must select the page we want to view from the list.

Unfortunately, here, as in Internet Explorer, the Dav Toolbar does not display dynamically created elements. And in general, when we inspect the page, no JavaScript is run: links and buttons are not clicked. Let's hope that when DragonFly approaches release, we will see all these features.

Debug WEB Inspector in Safari

I’ll say right away that about the browser safari I whistled the information, therefore, as they say, I am not responsible for the adequacy of the material.

In order to enable the "Development" item in the Safari menu, you need to enable the corresponding item in the settings (the "Advanced" tab):

The following functions are available to us in the "Development" menu:

Let's take a closer look at the WEB inspector:

By default, the inspector opens in HTML view mode. But it can be switched to DOM view mode. To do this, there is a switch on the top plate. When hovering over an element in the inspector, it will be highlighted on the page itself. You can't see padding, change markup or CSS on the fly, or see dynamic changes to the DOMe on the fly like you can't in FireBug. But, you see, it looks very nice.

If you want to work with the inspector in a browser window, you can click on the button in the lower left corner.

Even in safari, such a function as the “Network Timeline” is available (the “Network” button in the inspector):

You can clearly see when and how long files are loaded. You can also view the request headers, but, unfortunately, you cannot view the content itself.

Debug for Developers in Google Chrome

Lame was born in an advanced form, and he immediately has, albeit crooked for now, but still tools for developers.

DOM Inspector;
javascript debugger;
JavaScript Console.

In order to inspect an element, right-click on it and select "View element code" in the context menu:

The functionality is the same as in Safari: elements are highlighted on hover, but CSS and HTML editing is not available, changes in the DOM are not tracked. Only, the button in the lower left corner, which should attach the inspector to the browser window, does not work.

In the "Resources" tab, we can see the following:

Slightly different from the scale in the safari. Translucent in this diagram are relative file sizes, and full color is download time. One way or another, it is obvious that this part of Chrome is still far from being completed.

In this article, I reviewed the most famous extensions and built-in tools for browsers.

There are others, for example:

Internet Explorer WEB Development Helper is a good helper for ASP.NET developers (Internet Explorer);
WEB Developer Toolbar - toolbar for Internet Explorer and FireFox. There are several useful features;
WEB Accessibility Toolbar - toolbar for Internet Explorer. Nothing interesting.

If there are add-ons that I didn’t mention, but would be worth it, or there are functions for the mentioned extensions that I missed, write.

Use on health!

Writing HTML is great, but how do you know where the error is when something doesn't work? This article describes several tools that help you find and fix errors in HTML.

Debugging is not scary

While writing some code, everything usually goes well until the moment when you make a mistake. So your code doesn't work, or doesn't work the way you intended. If you try to compile a non-working Rust program, the compiler will report an error:

In this case, the error message is relatively easy to understand - "unterminated double quote string". If you look closely at println!(Hello, world!"); , you'll notice that the double quote is missing. Of course, error messages can get a lot more difficult to understand as your code grows, and even the simplest cases may seem intimidating for those who don't know anything about Rust.

But don't be afraid to debug! To comfortably write and debug any code, you need to understand the language and its tools.

HTML and Debugging

HTML is not as hard to understand as Rust. The HTML is not compiled into any other form before the browser parses it and displays the result (it is interpreted, not compiled). The syntax of HTML elements is much clearer than that of "real programming languages" such as Rust, JavaScript, or Python. The way browsers read HTML is more tolerant than programming languages that interpret their code more strictly. This is both bad and good at the same time.

tolerant code

So what does tolerant mean? In general terms, when you mess up in code, there are two types of errors you will run into:

Syntax errors: These are spelling errors, as above in the Rust example. These are usually easy to fix, as long as you are familiar with the syntax of the language and know what the error messages mean.
Logic errors: These are errors that appear when the syntax is correct, but the code does not fulfill its purpose, that is, the program does not execute correctly. These are more difficult to fix than syntactic ones, since no messages are displayed indicating the place where you made a mistake.

HTML does not suffer from syntax errors because the browser reads code tolerantly, in the sense that pages can be rendered even if syntax errors are present. Browsers have built-in rules for interpreting badly written markup, and you can run something even if you meant something else. This can be a real problem!

On a note: HTML is readable because when the web first came into existence, it was decided to allow people to publish content even if the code was incorrect, as this is much more important than making sure that the syntax is absolutely correct. The web wouldn't be so popular right now if it were strict about newbies.

Active Learning: Introducing Tolerant Code

Time to explore the nature of tolerant code in HTML.

HTML Validation

It is clear from the example above that it is worth checking the validity of the HTML. In the simple example above, you can just go through all the code and find errors, but what about huge, complex pages?

It is best to check the page in the markup validation service. It was created and maintained by the W3C, the organization responsible for the specification of HTML, CSS, and other web technologies. The service will check your HTML and report errors in it.

HTML can be checked at the address by uploading the file or simply copying it to the page.

Active Learning: Validating an HTML Document

Open the markup validation service in your browser.
Switch to Validate by Direct Input mode.
Copy the entire code of the document (not just the body) and paste it into the input space.
Press Check (check).

You will see a list of errors and other information.

Working with Error Messages

Usually it is immediately clear what the messages mean, but sometimes you have to try to understand what it is. Now we will go through all the errors and analyze what they mean. Note that the messages include a row and a column of code to make it easier to find errors.

"End tag li implied, but there were open elements" (2 instances): There is no explicit end tag, although the browser guesses where it should be. The message points to the line after the one where the end tag was expected, but you'll find the right place.
"Unclosed element strong": This is a very simple mistake - element) indicates that its content is of great importance, seriousness or urgency. Browsers usually render content in bold."> is not closed and the message points directly to the start tag.
"End tag strong violates nesting rules": The element is nested incorrectly - there is no matching opening tag at this level.
"End of file reached when inside an attribute value. Ignoring tag": Mysterious message. The matter is that somewhere (most likely, at the end of the document) the property of an element is incorrectly registered, and the end of the file appeared in this property. The link is not visible in the browser - most likely, the problem is next to it.
"End of file seen and there were open elements": The file has ended, but some elements are not closed. The message indicates the end of the file, in this case the element is not closed example: link to Mozilla homepage ↩

↩ ↩

Quite often, users can observe a situation where a script error message appears in the browser (IE). If the situation is isolated, then you should not worry, but when such errors become regular, then you should think about the nature of this problem.

Script error in Internet Explorer is usually caused by incorrect processing of the HTML page code by the browser, the presence of temporary Internet files, account settings, and many other reasons, which will be discussed in this material. Methods for solving this problem will also be considered.

Before proceeding with the common methods for diagnosing problems with Internet Explorer that cause script errors, you need to make sure that the error occurs not only on one particular site, but on several web pages at once. You also need to check the web page that is experiencing this problem under a different account, on a different browser, and on a different computer. This will narrow the search for the cause of the error and exclude or confirm the hypothesis that messages appear as a result of the presence of certain files or settings on the PC.

Blocking Internet Explorer active scripts, ActiveX and Java

Active scripting, ActiveX controls and Java affect the way information is generated and displayed on the site and can be the real cause of the previously described problem if they are blocked on the user's PC. In order to make sure that script errors occur for this reason, you just need to reset the browser's security settings. To do this, follow the following guidelines.

Open Internet Explorer 11
Service

In the window, go to the tab Security
Next click the button Default and then the button OK

Internet Explorer Temporary Files

Every time you open a web page, Internet Explorer saves a local copy of this web page on your PC in so-called temporary files. When there are too many such files and the size of the folder containing them reaches several gigabytes, problems with displaying the web page may occur, namely, a script error message will appear. Regularly clearing the temporary files folder can help fix this problem.
To delete temporary Internet files, follow the steps below.

Open Internet Explorer 11
Service
In the window, go to the tab General
In section Browser history press the button Delete…

In the window Delete browsing history check the boxes next to the items Temporary files of the Internet and websites, Cookies and website data, Journal
Click the button Delete

Operation of antivirus software

Script errors are possible through the operation of an antivirus program when it blocks active scripts, ActiveX and Java controls on a page, or folders to save temporary browser files. In this case, you should refer to the documentation for the installed anti-virus product and disable scanning folders to save temporary Internet files, as well as blocking interactive objects.

Incorrect processing of HTML page code

It appears, as a rule, on one particular site and indicates that the page code is not fully adapted to work with Internet Explorer. In this case, it is best to disable script debugging in the browser. To do this, follow these steps.

Open Internet Explorer 11
In the upper right corner of the browser, click the icon Service in the form of a gear (or the key combination Alt + X). Then, in the menu that opens, select
In the window, go to the tab Additionally
Next, uncheck the box Show notification for every script error and press the button OK.

This is a list of the most common reasons that cause script errors in Internet Explorer, so if you are tired of such messages, pay a little attention and solve the problem once and for all.

At the moment, there are a large number of different browsers that support the existing HTML standards to one degree or another. Personally, I prefer the browser from Mozilla Corporation. This browser has a long history (it is based on the famous Netscape Navigator browser). I also like this browser because it supports a system of plug-ins - separately distributed add-ons, when connected, you can change the functionality and customize it to your needs. And finally, this browser is freely distributed with open source codes, which is also important. Therefore, I decided to describe the possibilities that this browser provides not only to the user, but also to the developer of Web pages, how easy and convenient the process of debugging written products can be.

Mozilla Firefox is one of the most popular browsers among developers and web developers. It attracts their attention because of the opportunities that this browser provides for debugging created projects, fixing bugs, and improving. The browser comes standard with a java console (or "error console"). This utility allows you to debug embedded java-scripts. But, third-party plugins give much more functionality to the browser, which can be downloaded and installed from the official website of the Mozilla Foundation. Now I want to look at two of these plugins - Web Developer and Firebug . Both of these add-ons can be downloaded from the above links from the official add-on site. After installing them and restarting the browser, the developer has ample opportunities, which I will describe below, in turn for each of the plugins.

firebug plugin

As stated on the official page: “Firebug integrates with the Firefox browser to greatly enrich the developer toolkit. You will be able to edit, debug, and explore CSS, HTML, and Javascript live, on any web page.” And indeed it is. Consider some of the functions of this plugin, namely:

View and edit HTML.
Building CSS.
Network request monitoring
Debugging JavaScript
JavaScript research
Logging for JavaScript

This is not a complete list of all its features. Since the project is open source, anyone can change and add functionality.

To work with the plugin, you must press the F12 key (Ctrl-F12 to work with it in a separate window). After a successful launch, we get the following - Figure 1a, 1b.

Figure 1a. The initial window of the firebug plugin.

Figure 1b. The initial window of the firebug plugin.

Next, the actual work with the plugin begins. Let's say we need to find this or that object in the HTML code, or determine how exactly the current fragment is implemented using CSS. To do this, you just need to select the necessary options in the plug-in window menu with the mouse. In the example below, this is HTML in Inspect mode. Now, going to the page of the document, under the mouse cursor we will notice a rectangular area illustrating here the area with which we are working. In the plugin window, we will see the HTML and CSS parameters that are used. Also, by clicking on each of them, you can make changes and track them in dynamics. The described actions are illustrated in figures 2,3,4.

In the development of this project, the plugin described above was used precisely for these purposes. However, although no java-script has been used here, the firebug plugin can be used to debug it as well. An example of debugging is shown in Figure 5.

On this, as described above, the functionality of this extension is not limited. You can study it completely and use it to your needs by downloading it from the links provided, after installing Mozilla Firefox.

web developer plugin

Web Developer is the second extension for the Mozilla Firefox browser, very powerful and functional, which allows you to quickly and efficiently debug. After installing it, an additional toolbar will appear in the browser window, shown in Figure 6.

Further work with the plugin is intuitive. For example, if we need to do CSS work (though not as fully functional as with the Firebug plugin), we can click the CSS menu and disable, enable, or disable.

It is very convenient for a developer to be able to see how his project will look on monitors with different resolutions. To do this, use the Resize tab. Here you can manually set the required screen resolutions (800x600, 1024x768, etc.), and then freely switch between them, zoom in or out of content. This functionality is shown in Figure 7.

This extension also has rich functionality, which are all described and available on the official sites.

List of sources used

1. www.getfirebug.com
Official website of the add-on.
2. http://addons.mozilla.org
The official site of Mozilla, which hosts plugins for the Firefox browser, information for developers, information on using plugins.
3. http://chrispederick.com/work/web-developer/
Official website of the WebDeveloper plugin developer.

Updated: November 2007

The ASP.NET platform provides extensive support for debugging web applications. However, due to the distributed nature of web applications, debugging them differs in some ways.

In general, web applications are debugged in the same way as other Visual Studio applications. You can set breakpoints, start the debugger, pause code execution, inspect variable values, and perform all the functions associated with the Visual Studio debugger. See the section for more information. In addition, ASP.NET supports a trace mode that allows you to insert instrumentation messages into forms. See sections and for details.

See the section for more information about remote debugging.

Regardless of where you will be debugging - on the local computer or on a remote one - you need to make sure that debugging is allowed for this particular web application. Debugging is enabled using an element in the Web.config file, which is part of the web application project. This option instructs the compiler to insert debugging symbols into compiled application code so that the debugger can be used on it. You can enable debugging using the Web Site Administration tool. See the section for more information.

There are many articles on Habré that describe interesting and complex aspects of web development, but there are many readers who, at the beginning of their career as a web developer, would like to see material that would allow you to take the first step from “PHP in 24 hours” to development at a serious level, and I would like to share my experience in this matter.

The features of the web application make it divided into two parts: client and server. On the client side, JavaScript code works (maybe VBScript can also be found somewhere, but we will probably not consider this case), on the server side - a lot of things, in principle, but we will consider PHP, the most popular language for server side of web applications. It would also be interesting to talk about debugging and profiling Flash applications on the client side, but the topic covered is already extensive, so let's leave it for now.

The analysis and validation of HTML code can also be attributed to the tasks of debugging client code. This seems to be a task not entirely from the field of programming, but also important.

Some parts of the considered tasks have already been considered in other articles, and I have provided links to them.

Debugging and profiling client code

The "classic" way to debug JavaScript code is to use the alert function and its derivatives. I remember that at the beginning of my career, I personally wrote the print_r function for JavaScript, because I did not see the possibility to display debug information on arrays and objects. It looked something like this:
function print_r(variable) ( if (variable instanceof Array || variable instanceof Object) ( var key; for (key in variable) alert(key + " => " + variable); ) else ( alert(variable); ) )

Of course, there was no talk of any profiling at all.

With this approach, even information about the console object is revolutionary.

The specifics of the client side of a web application requires debugging the code in all popular browsers. Of course, most often there is enough debugging in Internet Explorer and any other normal browser, but we will consider all options.

Mozilla Firefox

Probably, it is Firefox that can be called the pioneer of debugging client code. For a long time, it was listed as the browser of choice for development, thanks to the Firebug extension, which probably contains everything you need, except for HTML code validation.

Also, starting from version 4, a built-in Web Console appeared, which implements part of the functions of the Firebug "Console" and "Network" tabs, as well as some CSS debugging capabilities.

Starting with version 6, the Simple JavaScript Editor appeared, which also implements one of the Firebug's functions, and allows you to write and execute code directly in the browser.

Starting with version 10, the Page Inspector appeared, which allows you to study HTML code and CSS properties, that is, it implements the functions of the HTML tab.

The Html Validator extension is usually responsible for validating HTML code. Just its icon, indicating the number of errors on the main page of the site habrahabr.ru, can be seen in the lower right corner of the browser in the picture with the Page Inspector.

Also, taking this opportunity, I will point out that for this browser there are many extensions that make life easier, about which there was already a corresponding one on Habré.

Google Chrome and Safari

These WebKit-based browsers have a built-in Web Inspector authoring tool that is very well developed and implements almost the same functionality as Firebug. At the same time, we must pay tribute to him, he does not slow down the browser, which is found in the "big brother".

In Chrome, it can be invoked by pressing Ctrl+Shift+I or simply by pressing F12 . In Safari, it is well hidden, and to use it, you need to enable development options in your browser settings. Later, the developer tools will become available from the "Develop" item of the main menu or by pressing the keyboard shortcut Ctrl+Alt+I .

To validate HTML code, you also need to install third-party extensions. For example, for Chrome, this could be Validity . For Safari, nothing suitable has yet been found.

Opera

Opera also has a built-in developer tool called "Opera Dragonfly" that can be invoked at any time with the keyboard shortcut Ctrl+Shift+I . It is similar to what WebKit presents us, and has similar features and advantages, although, in my personal opinion, it is less convenient.

Debugging and profiling server code

xdebug

As we agreed at the beginning, we are considering the case where PHP is used on the server. Here the "classic" debugging methods are echo , print_r and var_dump , but there is also a debugging tool, as in the best houses - Xdebug . For me personally, due to the specifics of studying at the institute, it looked “just like in Delphi”.

The xdebug extension allows you to at least step through the code and view the values of variables, which takes PHP programming to a new level. About the intricacies of working with xdebug there was a corresponding . XDebug is usually available in the GNU/Linux repositories, on Windows it is also not too difficult to install by copying the dll file.

When using this extension, an incoming connection is received from the server to the development computer (by default, on port 9000), which it must process. To do this, you need to configure your IDE accordingly.

By the way, using an IDE is also a prerequisite for moving forward. Some programmers believe that the difference between programming in a code-highlighted notepad and in an IDE can only be seen on large projects, but personally I am of the opinion that the difference is visible even on the program "Hello world!" - one autosubstitution of names and arguments of standard functions is worth something.

XHProf

About extension

Yes, xdebug provides profiling capabilities, but I personally like Facebook's development for this purpose, XHProf . I honestly did not conduct any tests, but this extension is considered to be much better suited for production servers and for profiling under real loads.

Installation

Unfortunately, this extension is not included in any repositories. It is included in PECL, but for some reason its regular installation often causes problems. For this reason, you have to install from source.

# Get the sources wget http://pecl.php.net/get/xhprof-0.9.2.tgz # Unpack the sources tar -xvf xhprof-0.9.2.tgz # Change to the directory containing the extension code cd xhprof-0.9. 2/extension/ # Compile and test phpize ./configure make make test # Install civilly checkinstall
The xhprof.ini configuration file gives us something like this:

extension=/usr/local/lib/php/extensions/no-debug-non-zts-20090626/xhprof.so
; Directory for logs
xhprof.output_dir="/var/log/xhprof/"

Profiling

The directory that we get by unpacking the archive contains, in addition to the extension sources, also a web interface for studying the profiling results, and libraries for profiling the application.

Let's take an example of profiling. The following elements must be included in the application code:
// Beginning of the script, enable profiling // of both CPU and memory load xhprof_enable(XHPROF_FLAGS_CPU + XHPROF_FLAGS_MEMORY); /* * Main application code */ // End of script, finish profiling, // write the result to the log $xhprofData = xhprof_disable(); include_once XHPROF_DIR."/xhprof_lib/utils/xhprof_lib.php"; include_once XHPROF_DIR."/xhprof_lib/utils/xhprof_runs.php"; $xhprofRuns = new XHProfRuns_Default(); $namespace = "some-unique-name"; $runId = $xhprofRuns->save_run($xhprofData, $namespace); echo "\n";
Here the XHPROF_DIR constant points to the directory where we unpacked the downloaded archive.

To analyze the results, you need the same web interface. It can be found in the $XHPROF_DIR/xhprof_html/ directory - let's conventionally denote it like this. For example, we located it in a place accessible to the web server, and it is available at example.com/system/xhprof/ , then to analyze the result of the work, we need to access it as follows:

Example.com/system/xhprof/?run=%runId%&source=%namespace%

We will get a similar result:

Profiling can be included in the application code on a permanent basis, or, for example, you can make it run randomly with a certain probability or on the presence of a certain condition. For example, like this:

$needProfiler = (mt_rand(0, 100)< 10 or isset($_COOKIE["xhprof"])); if ($needProfiler) xhprof_enable(XHPROF_FLAGS_CPU + XHPROF_FLAGS_MEMORY);
In this case, you can, having complaints from customers or suspicions, turn to the results of profiling for a certain time period. Using the namespace parameter, you can determine which part of the application (which script, controller, action) was profiled.

Profiling SQL queries

As a rule, it is the work with the database that is the bottleneck in the application. For this reason, query profiling is recommended. For example, consider part of a class that wraps around mysql extension functions. Yes, I know that this extension is not very loved and wish it dead no less than the good old IE6. I do not urge to use it, it's just that such a class is at my fingertips.

/** * Query * @param string $sql Query * @param array $params Parameters * @param string $query Compiled query * @return array Result */ public function query($sql, array $params = array(), & $query = "") ( $start = microtime(TRUE); // Execute the query, including parameter "protection" $stop = microtime(TRUE); $time = $stop - $start; $this->_addProfilerData($sql , $time); // Return result ) private function _addProfilerData($query, $time) ( if (is_array(self::$profilerData)) ( self::$profilerData = array("query" => $query, " time" => $time); ) ) public function __destruct() ( if (is_array(self::$profilerData)) ( $this->_writeProfilerData(); self::$profilerData = FALSE; ) // Disconnect from the database ) private function _writeProfilerData() ( $values = array(); foreach (self::$profilerData as $row) ( $query = mysql_real_escape_string($row["query"], $this->con); $time = ( float)$row["time"]; $hash = crc32($row["query"]); $values = "($hash, "$query", $time)"; ) if ($values) ( $strValues = implode(", ", $values); $sql = "INSERT DELAYED INTO `profiler_queries` (`query_hash`, `query`, `work_time`) VALUES $strValues"; @mysql_query($sql, $this->con); ) )
Here, query profiling data is stored in the profiler_queries table. This table can be of type MyISAM or Archive, as they provide the ability to perform lazy inserts, which does not create an unnecessary delay in the response when profiling. Also, for a better search for queries in the table, it is better to create a column of type INT , where the crc32 hash of the query will be written, on which you want to create an index.

Conclusion

The article is quite large. Perhaps here I went over the top and touched on topics that have already been touched upon, but if I had read something similar in due time - an article where all the information is collected together and useful links are given, it would have been of invaluable help to me. I hope that my article will help someone on the path to enlightenment.

Quite often, users can observe a situation where a script error message appears in the Internet Explorer (IE) browser. If the situation is isolated, then you should not worry, but when such errors become regular, then you should think about the nature of this problem.

Before proceeding with the common methods for diagnosing problems with Internet Explorer that cause script errors, you need to make sure that the error occurs not only on one particular site, but on several web pages at once. You also need to check the web page that is experiencing this problem under a different account, on a different browser, and on a different computer. This will narrow the search for the cause of the error and exclude or confirm the hypothesis that messages appear as a result of the presence of certain files or settings on the PC.