Stay organized with collections
Save and categorize content based on your preferences.
Thursday, May 27, 2010
The
Chrome Developer Tools
are great for debugging HTML, JavaScript and CSS in Chrome. If you're writing a webpage or even a
web app for the
Chrome Web Store, you can
inspect elements in the DOM, debug live JavaScript, and edit CSS styles directly in the current
page. Extensions can make Google Chrome an even better web development environment by providing
additional features that you can easily access in your browser. To help developers like you, we
created a page that
features extensions for web development.
We hope you'll find them useful in creating applications and sites for the web.
For example,
Speed Tracer
is an extension to help you identify and fix performance issues in your web applications. With
Speed Tracer, you can get a better idea of where time is being spent in your application and
troubleshoot problems in JavaScript parsing and execution, CSS style, and more.
Another useful extension is the
Resolution Test
that changes the size of the browser window, so web developers can preview websites in different
screen resolutions. It also includes a list of commonly used resolutions, as well as a custom
option to input your own resolution.
With the
Web Developer
extension, you can access additional developer tools such as validation options, page resizing
and a CSS elements viewer; all from an additional button in the toolbar.
Another extension you should check out is the
Chrome Editor
that allows you to easily code within your browser, so you don't have to flip between your browser
and code editor. You can also save a code reference locally to your computer for later use.
[[["Easy to understand","easyToUnderstand","thumb-up"],["Solved my problem","solvedMyProblem","thumb-up"],["Other","otherUp","thumb-up"]],[["Missing the information I need","missingTheInformationINeed","thumb-down"],["Too complicated / too many steps","tooComplicatedTooManySteps","thumb-down"],["Out of date","outOfDate","thumb-down"],["Samples / code issue","samplesCodeIssue","thumb-down"],["Other","otherDown","thumb-down"]],[],[[["\u003cp\u003eChrome Developer Tools are useful for debugging HTML, JavaScript, and CSS, and extensions can further enhance the web development experience in Chrome.\u003c/p\u003e\n"],["\u003cp\u003eSpeed Tracer helps identify performance bottlenecks in web applications by providing insights into JavaScript, CSS, and other areas.\u003c/p\u003e\n"],["\u003cp\u003eResolution Test allows developers to preview websites in various screen resolutions, including common presets and custom options.\u003c/p\u003e\n"],["\u003cp\u003eWeb Developer extension adds tools for validation, resizing, and CSS element viewing directly within the browser.\u003c/p\u003e\n"],["\u003cp\u003eChrome Editor enables coding directly within the browser and allows saving code references locally.\u003c/p\u003e\n"]]],["Chrome extensions enhance web development by providing tools within the browser. Key extensions include Speed Tracer for identifying performance issues, Resolution Test for previewing websites at various screen sizes, Web Developer for validation and CSS tools, and Chrome Editor for coding directly in the browser. Developers can find these and more extensions on the designated web development page and the extensions gallery to help create web applications.\n"],null,[]]