شاید تا به حال به این فکر افتاده بودید
که برنامهی شما چه مقداری از RAM ، CPU و ... را اشغال کرده است، و جواب آن را به طور مثال در Task Manager ویندوز پیدا کرده باشید. اما آیا تا به حال به این فکر رفته اید
که خب این برنامه چرا باید این مقدار از حافظه را اشغال کند و بخواهید به طور دقیق
مقدار حافظه را چک کنید، که چه آبجکت هایی از چه کلاس هایی چه مقدار از رم را
اشغال کرده است. در این مقاله قصد دارم که ابزاری به شما معرفی کنم که شما به کمک آن
میتوانید به راحتی در هنگام Debug برنامه خود
مصرف حافظه برنامهی خود را با جزئیات آن بسنجید .
همچنین شما میتوانید با اعمال یک سری از تغییرات بر روی برنامه متوجه شوید که این
تغییرات چقدر بر مصرف حافظهی شما تاثیر داشته اند.
با Memory Usage Tool که در VS2015 وجود دارد، شما میتوانید در حالت عیب یابی (debugging) ، مصرف حافظهی خود را بسنجید.
· Break-Aware Live Graph
یکی از قابلیتهای کلیدی Diagnostic Tools window این است که فقط در زمانی که برنامه در حال اجرا با در زمانی که به وسیلهی breakpoint متوقف شده باشد،گراف را ثبت میکند. پس وقتی که به وسیلهی یک breakpoint برنامه متوقف شده باشد، این گراف هیچ پیشروی نخواهد کرد مگر اینکه شما برنامه را ادامه دهید. در این صورت گراف با شرایط فعلی برنامه شما پیشروی خواهد کرد.
شما میتوانید این ابزار را در موقعی که برنامهی شما
در حال اجراست در سمت راست مشاهده کنید. همچنین میتوانید در هنگامی که برنامهی شما از حالت اجرا خارج شد این ابزار را از مسیر
Debug -> Show
Diagnostic Tools بیاورید
خب حالا وقت آن رسیده که درباره طرز کار این ابزار با هم صحبت کنیم. همانطور که گفتم وقتی برنامه در حال اجراست، این ابزار به طور خودکار در سمت راست صفحه ظاهر خواهد شد. برای اینکه بتوانید مصرف حافظه با جزئیات آن را ببینید میتوانید به روش زیر عمل کنید.
ابتدا بر روی گزینهی Memory Usage کلیک کرده و گزینهی Take Snapshot را انتخاب کنید
وقتی که بر روی این گزینه کلیک کردید مصرف حافظهی شما به جزئیات به شما نشان داده میشود.
حال میتوانید با انتخاب مقدار Object از مصرف حافظهی کلاسهای خود و آبجکتهای خود مطلع شوید.
با این ابزار شما قادر خواهید بود که میزان تغییر حافظه بر اساس مقایسه بین دو Snapshot را بسنجید. برای اینکار شما میتوانید بعد از اعمال تغییرات، و یا بعد از زمانی مشخص دوباره بر روی گزینهی Take Snapshot کلیک کنید. در این حالت شما میتوانید تغییری که بر روی حافظهی شما اعمال گردیده را مشاهده کنید.
تعدادی از بهانههای توسعه دهندهها!
بررسی روش آپلود فایلها در ASP.NET Core
$(function () { // اینجا اسکریپتهای جیکوئری باید تعریف شوند });
Map-Reduce و Google
نمایش اعلانات با Pnotify
<img [src]="...." />
<img [ngClass]='..' />
import { Directive, ElementRef, OnInit } from '@angular/core'; @Directive({ selector: '[appHighlight]', }) export class HighlightDirective implements OnInit { _dval = 'green'; constructor(private _ref: ElementRef) { } ngOnInit(): void { this._ref.nativeElement.style.backgroundColor = this._dval; } }
<span appHighlight>Attibute Directive</span>
حال ممکن است که بخواهید به این ویژگی مقداری را نسبت دهید و از طریق این مقدار، عملیات مورد نظر را انجام دهید. به عنوان نمونه در اینجا میخواهیم رنگ پس زمینه را در همان تگ معرفی کنیم:
پس کلاس دایرکتیو را به شکل زیر بازنویسی میکنیم:
import { Directive, ElementRef, OnInit } from '@angular/core'; @Directive({ selector: '[appHighlight]', inputs: ["hc"] }) export class HighlightDirective implements OnInit { hc: string; _dval = 'green'; constructor(private _ref: ElementRef) { } ngOnInit(): void { this._ref.nativeElement.style.backgroundColor = this.hc || this._dval; } }
معرفی کردن یک فیلد به عنوان ورودی در انگیولار، از دو طریق امکان پذیر است:
1. در اولین حالت شما متغیری را تعریف میکنید و آن متغیر را همانند کد بالا داخل ویژگی inputs متادیتای Directive معرفی میکنید.
2. در شیوه بعد که در این مقاله هم ذکر شده است میتوانید از طریق متادیتایی به نام Input@ اینکار را انجام دهید:
@Input() hc:string;
اینکه از کدام شیوه استفاده کنید تفاوتی ندارد و به خودتان بستگی دارد. ولی شیوهی اول به دلیل اینکه همه یکجا تعریف میشوند، نظم بهتری داشته و در یک نگاه میتوان ورودیها را تشخیص داد؛ ولی در شیوهی دوم باید کل کلاس را برای یافتن آنها مشاهده کرد.
مزیت روش دوم این است که در حین کدنویسی بسیار راحت است تا در همانجا ورودی را تعریف کنیم؛ به جای اینکه مرتب به ابتدای کلاس بازگردیم تا آن را تعریف کنیم.
this._ref.nativeElement.style.backgroundColor=this.hc || this._dval;
<h1 appHighlight [hc]="'red'"> َApp Works! </h1>
<h1 appHighlight [hc]="'red'" [hc2]="....." [hc3]="....." ....> App Works! </h1>
گاهی اوقات ممکن است بخواهید عمل مورد نظر را بر اساس رویدادهای یک المان انجام دهید. پس کلاس را مجددا بازنویسی کرده و کدهای جدید را به آن اضافه میکنیم:
import { Directive, ElementRef, OnInit } from '@angular/core'; @Directive({ selector: '[appHighlight]', inputs: ["hc"], host: { '(mouseenter)': 'onMouseEnter()', '(mouseleave)': 'onMouseLeave()', } }) export class HighlightDirective implements OnInit { hc: string; _dval = 'green'; constructor(private _ref: ElementRef) {} ngOnInit(): void { this._ref.nativeElement.style.backgroundColor = this.hc || this._dval; } onMouseEnter() { this._ref.nativeElement.style.backgroundColor = 'blue'; } onMouseLeave() { this._ref.nativeElement.style.backgroundColor = 'pink'; } }
نمایش چندی خطی یک فیلد
منتهی همانطور که مشاهده میکنید کماکان با تاریخ مشکل دارم. از تابع FixWeakCharacters نیز استفاده کرده ام ولی باز هم مشکل دارم، کد سلول سفارشی نیز این است :
public PdfPCell RenderingCell(CellAttributes attributes) { var value = attributes.RowData.TableRowData.GetSafeStringValueOf(colName); var mainTable = new PdfGrid(1) { WidthPercentage = 100, RunDirection = PdfWriter.RUN_DIRECTION_RTL }; string[] seperatedLine = value.Split(new string[] { Environment.NewLine }, StringSplitOptions.None); foreach (var line in seperatedLine) { mainTable.AddSimpleRow((data, cellProperties) => { cellProperties.BorderWidth = 1f; cellProperties.BackgroundColor = attributes.BasicProperties.BackgroundColor; data.Value = line.FixWeakCharacters(); cellProperties.RunDirection = PdfRunDirection.RightToLeft; cellProperties.CellPadding = 2; cellProperties.PdfFont = attributes.BasicProperties.PdfFont; cellProperties.HorizontalAlignment = HorizontalAlignment.Left; }); } var cell = new PdfPCell { Border = 1, RunDirection = PdfWriter.RUN_DIRECTION_RTL, HorizontalAlignment = Element.ALIGN_RIGHT }; cell.AddElement(mainTable); return cell; }
با تشکر