• Decoded World

    The Mysteries of Humanity: Leonardo da Vinci

  • Decoded World

    The Unsung Hero: Nikola Tesla

  • Decoded World

    The Wizard of Light: Thomas Edison

  • Decoded World

    Adolf Hitler: The Master Manipulator

07 July 2024

Marquise de Brinvilliers Castle

🏰 Marquise de Brinvilliers Castle

Hidden deep inside Lorraine, this abandoned castle has been swallowed by nature. Thick vegetation, broken walls, and silence surround the ruins.

The castle was destroyed after a violent fire in 1969. Since then, it has remained abandoned like a forgotten ghost from the past.

Before the tragedy, wealthy industrialists lived here. Esther and Théodore seemed to have a perfect life — fortune, status, and a castle.

But behind the luxurious walls was pain. Esther desperately wanted a child, while Théodore struggled with sterility.

Their relationship slowly turned cold and toxic. The castle became filled with silence, resentment, and emotional suffering.

After years of failed treatments, desperation pushed them toward dark decisions. Their obsession with having a child slowly destroyed their sanity.

Eventually Esther became pregnant, bringing hope back into the castle. For a brief moment, happiness returned.

But tragedy struck during the pregnancy. Esther suffered a devastating miscarriage that shattered both their lives forever.

Consumed by grief, Esther slowly lost touch with reality. The castle transformed into a place of madness and horror.

One terrible night, violence erupted inside the castle walls. Fire consumed the estate, ending the tragic story forever.

Today, only ruins remain — silent witnesses to one of the castle’s darkest legends.

Source: urbexsession.com

12 September 2023

Luồng phê duyệt đơn

1. Người tạo đơn: Tạo đơn phê duyệt mới và cung cấp thông tin chi tiết về đơn như tiêu đề, mô tả và người được phê duyệt.

2. Người phê duyệt: Nhận thông báo về đơn phê duyệt và xem thông tin chi tiết. Có thể chọn phê duyệt hoặc từ chối đơn. 3. Approver: Nếu người phê duyệt chấp nhận đơn, quá trình phê duyệt được hoàn thành và đơn được chuyển đến bước tiếp theo. 4. Reject: Nếu người phê duyệt từ chối đơn, quá trình phê duyệt kết thúc và đơn bị từ chối. 5. Return: Nếu người phê duyệt muốn yêu cầu chỉnh sửa hoặc bổ sung thông tin, họ có thể chọn trả lại đơn để yêu cầu người tạo đơn thực hiện các thay đổi. 6. Người tạo đơn: Nhận thông báo về việc đơn bị từ chối hoặc yêu cầu chỉnh sửa. Có thể chỉnh sửa đơn và gửi lại để tiếp tục quá trình phê duyệt.  

Quy trình trên có thể được tùy chỉnh và điều chỉnh theo nhu cầu và quy trình công việc của tổ chức. 

Mô tả luồng qua lại giữa người tạo đơn và người phê duyệt. Người tạo đơn gửi đơn đến người phê duyệt. Người phê duyệt có thể phê duyệt, từ chối hoặc yêu cầu chỉnh sửa đơn. Nếu đơn bị từ chối, quá trình kết thúc. Nếu người phê duyệt yêu cầu chỉnh sửa, người tạo đơn sẽ chỉnh sửa và gửi lại đơn để tiếp tục quá trình phê duyệt.






Đề nghị thanh toán

Đề xuất mua hàng


Luồng phê duyệt gửi tiền có takeback

Quy trình công việc phê duyệt

Người gửi và người phê duyệt có các hành động riêng để thay đổi trạng thái của số tiền, cho biết số tiền đã gửi nằm ở đâu trong quy trình phê duyệt. Mỗi trạng thái có thể được lọc trong Tab Hoạt động (trước đây là Tab Ngân sách) trong Allocadia hoặc trong Thông tin chi tiết  (trước đây là Analytics). Một ví dụ về quy trình làm việc tổng thể như sau:


  1. Người gửi nhập giá trị vào Kế hoạch hoặc Dự báo tương ứng. Theo mặc định, tất cả các giá trị mới được nhập đều có trạng thái lập kế hoạch.
  2. Người nộp gửi số tiền Kế hoạch hoặc Dự báo để phê duyệt. Khi điều này xảy ra, giá trị ô sẽ chuyển sang trạng thái chỉ đọc và chuyển sang trạng thái chờ xử lý.
  3. Một số tùy chọn có sẵn khi số tiền đang chờ xử lý:
    • 3a. Người nộp có thể lấy lại số tiền trước khi người phê duyệt đưa ra quyết định hoặc nếu số tiền được yêu cầu đã bị người phê duyệt từ chối. Trong trường hợp này, trạng thái của số tiền sẽ trở lại trạng thái lập kế hoạch.
    • 3b. Người phê duyệt có thể gửi lại yêu cầu đang chờ xử lý kèm theo các nhận xét để sửa đổi. Trạng thái sau đó sẽ trở lại quy hoạch.
    • 3c. Người phê duyệt có thể chấp nhận yêu cầu và trạng thái sẽ trở thành được phê duyệt. Ô sẽ vẫn ở chế độ chỉ đọc.
    • 3d. Người phê duyệt có thể từ chối số tiền được yêu cầu và trạng thái của trường sẽ bị từ chối. Ô vẫn ở chế độ chỉ đọc.
  4. Đối với số tiền được phê duyệt, người gửi có thể gửi yêu cầu thay đổi. Allocadia sẽ tiếp tục hiển thị số tiền đã được phê duyệt với trạng thái thay đổi đang chờ xử lý. Giá trị hiển thị sẽ chỉ cập nhật nếu yêu cầu thay đổi được chấp thuận.

21 July 2023

Mô phỏng luồng stack và heap javascript?

 


Trong Javascript, có hai loại bộ nhớ chính: stack và heap. Chúng hoạt động khác nhau trong việc lưu trữ và quản lý dữ liệu. 

 

1. Stack: 

- Stack được sử dụng để lưu trữ các biến cục bộ, tham số và các giá trị trung gian khi hàm được gọi. 

- Mỗi khi một hàm được gọi, một khung dữ liệu mới được tạo trên stack để lưu trữ các biến cục bộ và thông tin về hàm. 

- Khi hàm kết thúc, khung dữ liệu đó sẽ được xóa khỏi stack, giải phóng không gian bộ nhớ. 

 

2. Heap: 

- Heap được sử dụng để lưu trữ các đối tượng động và dữ liệu có kích thước không xác định trước. 

- Đối tượng trên heap tồn tại cho đến khi không còn bất kỳ tham chiếu nào đến chúng. 

- Trong Javascript, việc quản lý heap được thực hiện tự động thông qua thu thập rác (garbage collection), nghĩa là các đối tượng không còn được sử dụng sẽ được tự động thu hồi bộ nhớ. 

 Ví dụ mô phỏng luồng stack và heap trong Javascript:

function foo() {
    let a = 1; // Biến a được lưu trữ trên stack
    let b = { value: 2 }; // Đối tượng b được lưu trữ trên heap, và tham chiếu đến nó được lưu trữ trên stack
    bar(a, b);
}
function bar(x, y) {
    let c = x + y.value; // Biến c được lưu trữ trên stack
    console.log(c);
}
foo();

Trong ví dụ trên, khi hàm  foo  được gọi, một khung dữ liệu mới được tạo trên stack để lưu trữ biến  a  và tham chiếu đến đối tượng  b . Sau đó, khi hàm  bar  được gọi, một khung dữ liệu mới khác được tạo trên stack để lưu trữ biến  x  và  y , trong đó  y  là một tham chiếu đến đối tượng  b  trên heap. Cuối cùng, giá trị của  x  và  y.value  được tính toán trên stack và kết quả được in ra màn hình. Khi hàm  bar  kết thúc, khung dữ liệu của nó được xóa khỏi stack, giải phóng không gian bộ nhớ.

12 July 2023

Session và Cookie ?



Session và Cookie là hai khái niệm quan trọng trong lập trình web để lưu trữ thông tin và duy trì trạng thái của người dùng trên trang web. 

 

Session (Phiên làm việc) là một cơ chế lưu trữ thông tin trên máy chủ. Khi một người dùng truy cập vào trang web, máy chủ sẽ tạo ra một phiên làm việc duy nhất và gán một ID phiên cho người dùng đó. Thông tin của người dùng, như tên, địa chỉ, giỏ hàng, sẽ được lưu trữ trong phiên làm việc này. Phiên làm việc thường được lưu trữ trên máy chủ và chỉ có thể truy cập thông qua ID phiên. Khi người dùng đăng xuất hoặc đóng trình duyệt, phiên làm việc sẽ bị hủy và thông tin của người dùng sẽ bị xóa. 

 

Cookie (Bánh quy) là một tệp nhỏ chứa thông tin được lưu trữ trên máy tính của người dùng. Khi người dùng truy cập vào một trang web, máy chủ có thể gửi một hoặc nhiều cookie đến trình duyệt của người dùng. Cookie chứa thông tin như tên người dùng, tuổi, sở thích, v.v. Trình duyệt sẽ lưu trữ cookie này và gửi nó lại cho máy chủ mỗi khi người dùng truy cập vào trang web đó. Cookie thường được sử dụng để duy trì trạng thái đăng nhập, theo dõi hoạt động của người dùng và cung cấp trải nghiệm cá nhân hóa trên trang web. 

 

Tóm lại, Session được lưu trữ trên máy chủ và Cookie được lưu trữ trên máy tính của người dùng. Cả hai đều giúp duy trì trạng thái và lưu trữ thông tin của người dùng trên trang web.

Sự khác nhau giữa function declaration và expression trong Javascript


Trong JavaScript, có hai cách khai báo hàm là function declaration (khai báo hàm) và function expression (biểu thức hàm). Dưới đây là sự khác nhau giữa hai cách này: 

 

1. Function Declaration (Khai báo hàm): 

   - Cú pháp: function functionName() { } 

   - Được khai báo trên cùng của phạm vi (hoisting), tức là bạn có thể gọi hàm trước khi khai báo nó trong mã. 

   - Có thể gọi hàm từ bất kỳ đâu trong phạm vi hiện tại. 

   - Thường được sử dụng cho các hàm lớn, phức tạp. 

 

Ví dụ:

function myFunction() {
  console.log('Hello!');
};
myFunction(); // Output: Hello!


2. Function Expression (Biểu thức hàm): 

   - Cú pháp: var functionName = function() { } 

   - Khai báo hàm bằng gán giá trị cho một biến. 

   - Không được hoisting, nghĩa là bạn chỉ có thể gọi hàm sau khi nó được khai báo trong mã. 

   - Phạm vi của hàm được giới hạn bởi phạm vi của biến mà nó được gán vào. 

   - Thường được sử dụng cho các hàm nhỏ, đơn giản hoặc trong các biểu thức khác. 

 

Ví dụ:

var myFunction = function() {
  console.log('Hello!');
};
myFunction(); // Output: Hello!

Tóm lại, function declaration và function expression đều cho phép bạn khai báo và sử dụng hàm trong JavaScript. Việc sử dụng loại nào phụ thuộc vào ngữ cảnh và yêu cầu của mã của bạn.

JS runtime cách xử lý bất đồng bộ và đồng bộ

 


JS runtime (thời gian chạy của JavaScript) xử lý bất đồng bộ (asynchronous) và đồng bộ (synchronous) theo cách khác nhau.


Khi JavaScript chạy trên trình duyệt, runtime sử dụng mô hình sự kiện (event-driven) để xử lý các sự kiện và tương tác người dùng. Khi có một sự kiện xảy ra, runtime sẽ đưa sự kiện đó vào hàng đợi sự kiện (event queue) và tiếp tục thực hiện các công việc khác. Khi runtime hoàn thành các công việc hiện tại, nó sẽ lấy sự kiện đầu tiên từ hàng đợi sự kiện và xử lý nó.


Đối với các tác vụ bất đồng bộ như gọi API, tải tệp tin, hoặc thực hiện các tác vụ mạng, JavaScript sử dụng các hàm bất đồng bộ như setTimeout, setInterval, fetch, XMLHttpRequest, hoặc Promise

. Khi gọi các hàm bất đồng bộ này, runtime sẽ không chờ đợi kết quả trả về mà tiếp tục thực hiện các công việc khác. Khi kết quả trả về, runtime sẽ đưa nó vào hàng đợi sự kiện và xử lý sau.


Đối với các tác vụ đồng bộ, JavaScript sử dụng cơ chế gọi lại (callback) hoặc 

async/await

 để xử lý. Khi gọi một hàm đồng bộ, runtime sẽ chờ đợi hàm đó hoàn thành trước khi tiếp tục thực hiện các công việc khác. Điều này có thể gây trì hoãn (blocking) trong quá trình thực thi.


Tuy nhiên, để tránh trì hoãn quá lâu và đảm bảo ứng dụng vẫn phản hồi, JavaScript runtime sử dụng mô hình bất đồng bộ và sự kiện để xử lý các tác vụ dài hạn. Bằng cách này, runtime có thể tiếp tục thực hiện các công việc khác trong khi đợi kết quả trả về từ các tác vụ bất đồng bộ.

10 July 2023

viewProvider vs provider khác nhau như thế nào Angular?


Trong Angular, "viewProvider" và "provider" là hai thuộc tính khác nhau được sử dụng để cung cấp dữ liệu và các đối tượng trong ứng dụng.


ViewProvider: Đây là một thuộc tính được sử dụng để cung cấp dữ liệu hoặc đối tượng cho một view cụ thể trong Angular. ViewProvider được khai báo trong phạm vi của một thành phần (component) và chỉ có hiệu lực trong view của thành phần đó. Nó được sử dụng để cung cấp dữ liệu hoặc đối tượng cho các thành phần con hoặc các directive trong view của thành phần chứa nó.
ViewProvider không hoạt động với ng-content (cần chú ý)


Provider: Đây là một thuộc tính được sử dụng để cung cấp dữ liệu hoặc đối tượng cho toàn bộ ứng dụng Angular. Provider được khai báo trong phạm vi của một module và có thể được sử dụng trong toàn bộ ứng dụng. Nó được sử dụng để cung cấp dữ liệu hoặc đối tượng cho các thành phần, directive, hoặc service trong ứng dụng.


Tóm lại, viewProvider được sử dụng để cung cấp dữ liệu hoặc đối tượng cho một view cụ thể trong Angular, trong khi provider được sử dụng để cung cấp dữ liệu hoặc đối tượng cho toàn bộ ứng dụng.

Các cách tăng performance cho ứng dụng angular?

 


Có nhiều cách để tăng hiệu suất cho ứng dụng Angular. Dưới đây là một số gợi ý:


Sử dụng AOT (Ahead-of-Time) Compilation: AOT Compilation giúp giảm thời gian tải ứng dụng và tăng tốc độ khởi chạy bằng cách biên dịch mã nguồn Angular thành mã máy trước khi chạy ứng dụng.


Lazy Loading: Sử dụng Lazy Loading để tải các module và component chỉ khi cần thiết, giúp giảm thời gian tải trang và tăng tốc độ chuyển đổi giữa các trang.


Sử dụng ChangeDetectionStrategy.OnPush: Đặt ChangeDetectionStrategy.OnPush cho các component để chỉ chạy kiểm tra thay đổi khi có sự thay đổi đầu vào từ phía component cha hoặc khi sự thay đổi được kích hoạt bằng cách sử dụng @Input hoặc async pipe. Điều này giúp giảm số lần kiểm tra thay đổi và tăng hiệu suất.


Sử dụng TrackBy trong vòng lặp *ngFor: Khi sử dụng vòng lặp *ngFor để hiển thị danh sách, hãy sử dụng trackBy để chỉ định một hàm xác định duy nhất cho mỗi mục trong danh sách. Điều này giúp Angular xác định các mục đã thay đổi và chỉ cập nhật các mục thay đổi thực sự, giúp tăng hiệu suất.


Sử dụng OnPush và Immutable Data: Sử dụng cơ chế OnPush và sử dụng dữ liệu bất biến (immutable data) để giảm số lần kiểm tra thay đổi và tăng hiệu suất.


Tối ưu hóa CSS: Loại bỏ CSS không sử dụng, sử dụng CSS minification và sử dụng các kỹ thuật như CSS Sprites để tối ưu hóa tải trang.


Sử dụng Web Workers: Sử dụng Web Workers để chạy các tác vụ nặng như tính toán phức tạp hoặc xử lý dữ liệu lớn trong một luồng riêng biệt, giúp tránh làm đóng băng giao diện người dùng.


Sử dụng Lazy Loading Images: Sử dụng kỹ thuật lazy loading để tải ảnh chỉ khi cần thiết, giúp giảm thời gian tải trang ban đầu.


Tối ưu hóa HTTP Requests: Sử dụng HTTP Interceptors để tối ưu hóa các yêu cầu HTTP bằng cách thêm caching, nén dữ liệu hoặc sử dụng HTTP/2.


Sử dụng Production Build: Sử dụng production build để tạo ra phiên bản tối ưu hóa của ứng dụng Angular, bao gồm việc loại bỏ mã không sử dụng và tối ưu hóa kích thước tệp tin.


Nhớ rằng, việc tăng hiệu suất không chỉ dừng lại ở việc áp dụng các kỹ thuật tối ưu hóa, mà còn phụ thuộc vào cấu trúc và thiết kế của ứng dụng.

06 July 2023

Có bao nhiêu Scopes trong Javascript

Scope Levels

1 - Global Scope
2 - Module Scope
3 - Block Scope
4 - Function Scope




Global Scope

<script src="script.js"></script>

<script>
  // script.js
  const a = 1
  console.log(a)
  // Prints: 1
</script>

<script src="script-1.js"></script>
<script src="script-2.js"></script>

<script>
  // script-1.js

  const a = 1
  // script-2.js

  console.log(a)
  // Prints: 1
</script>

Module Scope

<script src="script-1.js" type="module"></script>
<script src="script-2.js" type="module"></script>

<script>
  // script-1.js

  const a = 1
  console.log(a)
  // Prints: 1

  // script-2.js

  console.log(a)
  // Throws Uncaught Reference Error: a is not defined
</script>

Block Scope

function test() {
  const funcVar = "Func"

  if (true) {
    const ifVar = "If"
    console.log(funcVar, ifVar)
    // Prints: "Func", "If"
  }

  console.log(funVar, ifVar)
  // Throws Uncaught Reference Error: ifVar is not defined
}

{
  const a = 10
}

console.log(a)
// Throws Uncaught Reference Error: a is not defined

Function Scope

function test() {
  var funcVar = "Func"

  if (true) {
    var ifVar = "If"
    console.log(funcVar, ifVar)
    // Prints: "Func", "If"
  }

  console.log(funVar, ifVar)
  // Prints: "Func", "If"
}

 

BACK TO TOP

Xuống cuối trang